user3224207
user3224207

Reputation: 437

Concatenate two fields and use this value to change/set value of a hidden field

Here is what I want to achieve. I have a requirement in which there is one dropdown for country codes and another input field for mobile number. I want to send country code and mobile input value as combined value so for that I am using a hidden field. When not using a hidden field it is easy to change value of a third tag element but that will not send value when form is submitted. So hidden field has to be used. So I have tried doing this but it is not changing value of hidden field.

<html>
<head>
    <script language="javascript">
    var dropdown = '';
    var mobilenum = '';

    function calldropdown()
    {
        dropdown = document.getElementById("country_code_id").value;
        return dropdown;
    }

    function calltxtfield()
    {
        mobilenum = document.getElementById("mobileid").value;
        return mobilenum;
    }

    function codemobile()
    {
        document.getElementById("codemobileid").value = calldropdown() + ' ' + calltxtfield;
        alert(document.getElementById("codemobileid").value);
    }
    </script>
</head>
<body>
    <form>
        <select name="country_code" id="country_code_id" onchange="calldropdown()">
            <option value="">Select</option>
            <option value="+975">Bhutan</option>
            <option value="+977">Nepal</option>
            <option value="+94">Sri Lanka</option>
        </select>
        <input type="text" name="mobile" id="mobileid" onchange="calltxtfield()" />

        <input type="hidden" name="codemobile" id="codemobileid" value="" />
        <input type="submit" name="submit" value="Submit" onclick="return codemobile();" />
    </form>
</body>
</html>

Upvotes: 0

Views: 649

Answers (1)

tevemadar
tevemadar

Reputation: 13225

I can not explain it right now, but name="codemobile" seems to silently shadow function codemobile(). Rename one of the two and it works.

Also note that right now you are concatenating the function body (... + calltxtfield;), it should rather be ... + calltxtfield();

Upvotes: 3

Related Questions