Hidden value is passing while the div's display style is none using PHP

Question

Hi all,

Here is my JS:

 <script type="text/javascript">

 function display(action, id) { if
 (action == 'show') {
 document.getElementById("explanation"+id).style.display
 = "block"; document.getElementById("link"+id).href=
 "javascript:display('hide', "+id+")";
 document.getElementById("link"+id).innerHTML
 = "Close"; }

 if (action == 'hide') {
 document.getElementById("explanation"+id).style.display
 = "none"; document.getElementById("link"+id).href=
 "javascript:display('show', "+id+")";
 document.getElementById("link"+id).innerHTML
 = "Explain"; } }

 </script>

and HTML:

 <form name="test" id="test"
 method="post"
 enctype="multipart/form-data">
     {assign var="clone" value="0"}
     {section name=another loop=$dealImageTest}
     {assign var="cloneTemp" value=$clone++}
     <table><tr>
     <td width="121" align="left">
     <div id="explanation{$cloneTemp}" >

     <img src="{$dealImageTest[another]}"
 width="62" height="40" /><a
 id="link{$cloneTemp}"
 href="javascript:display('hide',
 {$cloneTemp})">Remove</a>

     <input type="hidden" name="dealImage_{$clone++}" id="{$dealImageTest[another]}"
 value="{$dealImageTest[another]}">

      </div>

      </td> </tr></table>

     {/section}

 </form>

When i click the remove button the image is hiding. But when i submit the form i am getting the hidden type's value.

But According to div if the style is hidden it will not pass any value.

How can is solve this issues. Any idea will be helpful and greatful. thanks in advance

Answer 1

All fields including hidden, are posted to web server.

Answer 2

Setting an input (or its container div) to hidden will not prevent the input from being sent to the server.

You would have to either physically remove the element, or set its value to null, when hiding the container. In order to not lose the original value, store it in a temporary variable, or a property of the input object.

Answer 3

Unfortunately hidden fields, even into 'display:none' HTML components, are sent to the server.

A possible solution could be adding another <input type="hidden" .../> field and change its value when you show/hide the div, so you will be aware on server side if you need to "consider" the value of "dealImage_xxx" or not.