This project is read-only.

Issue with multiple Javascript calls on fields

Topics: Writing modules
May 27, 2016 at 2:58 PM
I'm creating a module that allows users to see the status of a set of IP addresses by creating a custom field that holds the address (and validates it when it's first entered). On the Field view there's a glyphicon that changes based on the result of a ping attempt.

However, I'm having difficulty in getting the Javascript for pinging the address and each individual field to pass arguments correctly. For some reason, only the address from the first field is passed to the Javascript, instead of using the addresses from each individual field.

I've checked the page with Firebug and found that the onload arguments are collected and sent correctly, but the Javascript is only receiving the first field's contents. Since the Javascript uses the arguments to determine which DOM to change, only the first DOM is ever altered.

Here's the code for the view:

<link href="//" rel="stylesheet">
    string ipaddress = Model.ContentField.Value;
    string spanID = ipaddress + "span"; // Dynamic ID based on ipaddress value
    bool showPingResult = Model.ContentField.ShowPing; // A setting to determine if the ping result should be shown

<body onload="setPingResult('@spanID', '@ipaddress')">
        if (!string.IsNullOrEmpty(ipaddress)) {
            <span class="text-field">@ipaddress</span>
            if (showPingResult) {
                <span id="@spanID">
                    <span class="glyphicon glyphicon-question-sign" aria-hidden="true"></span>

And the .js code, which is temporarily simplified until I can get this figured out:
function setPingResult(givenID, value) {
    var elem = document.getElementById(givenID);
    elem.innerHTML = '<div class="glyphicon glyphicon-ok-sign" aria-hidden="true"></div>';
Let me know if there's any additional code or details I need to provide. Thanks!