How to change the HTML Value dynamically using javascript

Question

My Problem is in brief below: This is done using PHP, JS, Smarty and HTML

    <form name="todaydeal" method="post">
        <span id="fix_addonval"></span>
        <input type="radio" name="offer" id="offer_{$smarty.section.mem.index+1}" value="{$display_offers[mem].offervalue}" onclick="return sel_bees(this.value);" />
<input type="submit" name="SET" value="SET" />
        </form>
        {literal}
        <script>
        function sel_bees(Val)
        {
            document.getElementById('fix_addonval').innerHTML='<input type="hidden" name="addon" id="addon" value='+Val+' />'
        }
        </script>

    {/literal}

When i click on the radio button its value must be replaced via javascript innerHTML and it should be placed in the span id. When i submit the form using submit button the value which is replaced in the should be get in the next page. How can this be done ?

Any ideas will be thankful and grateful. Thanks in advance

Answer 1

Your code is so buggy ! Your question is not clear, but if you need to create a text box in the span using javascript you can do the following:

some mistakes you've made in your code
1) you said, you need to create a textbox so you should use (text) as the type of your input.
2) use (;) at the end of the javascript statement to run successfully in all browsers
3) use < script type="text/javascript"> for your javascript code, to make it more readable
4) you've forgot to enclose the value attribute in (") and I do it in the following code for you

jQuery:

$('fix_addonval').html('< input type="text" id="addon" value="' + Val + '"/>');

Answer 2

This approach looks convoluted for me. All you are trying to do is to create a dynamic hidden variable and assign a value to if the checkbox is checked. Ideally, I would keep the hidden variable in the markup and will assign the value to it if the checkbox is checked. Since it is hidden, it is not going affect your HTML markup.

Answer 3

I don't know if span element is supposed to contain anything else besides text, at least the XHTML way, and if the input is of type hidden it can safely reside in the page and simply replace the value.

Answer 4

Try it with jQuery.

http://jsfiddle.net/vXgzK/