Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    Regular Coder
    Join Date
    Oct 2009
    Posts
    438
    Thanks
    9
    Thanked 7 Times in 7 Posts

    Submit Form With Javascript

    All,
    I have the following code:
    PHP Code:
    <form action="javascript:getsub(document.getElementById('<?php echo "myform_sub".$resultsetstory['comment_id']; ?>'));" name="<?php echo "myform_sub".$resultsetstory['comment_id']; ?>" id="<?php echo "myform_sub".$resultsetstory['comment_id']; ?>">
     <textarea id="comment_sub" cols="70" rows="2"></textarea>
    <?php echo "<input id=\"comment_id_sub\" type=\"hidden\" value=\"$resultsetstory[comment_id]\" />"?>
    <?php 
    echo "<input id=\"user_name\" type=\"hidden\" value=\"$user_name\" />"?>
    <input type="button" name="button" value="Add Comment" onclick="javascript:getsub(this.<?php echo "myform_sub".$resultsetstory['comment_id']; ?>);">                
    </form><br  />
    This is in a while loop so the $resultsetstory['comment_id'] is always getting updated. When I try and submit the form it doesn't submit the correct form. It will only submit the last one. Any idea how I can get it to submit the correct one?
    Last edited by treeleaf20; 10-22-2009 at 04:53 AM. Reason: Code formatting.

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,852
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    Any idea how I can get it to submit the correct one?
    Validate your parsed html output(taken from browser's view source option) using http://validator.w3.org/#validate_by_input, and fix the errors in it.

    PS :
    <input type="button" name="button" value="Add Comment" onclick="javascript:getsub(this.<?php echo "myform_sub".$resultsetstory['comment_id']; ?>);">
    A javascript based submit form has a serious accessibility issue that it won't work for users with no javascript support.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    Regular Coder
    Join Date
    Oct 2009
    Posts
    438
    Thanks
    9
    Thanked 7 Times in 7 Posts
    I know it isn't but I'm using a Jquery and then the javascript file to put it in an innerHTML tag so I don't have to refresh the page. Is there any way to accomplish this same behavior without using javascript?

    I did this and everything in the form is correct. So I'm not sure why it will only submit the last form the browser displays instead of say the third one. Each form has a unique ID and the javascript submit that unique form.

  • #4
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,852
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    Have you seen my original reply before PS ?
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #5
    Regular Coder
    Join Date
    Oct 2009
    Posts
    438
    Thanks
    9
    Thanked 7 Times in 7 Posts
    I did, it gives me a couple warnings but nothing relating to the form input.

  • #6
    Regular Coder
    Join Date
    Oct 2009
    Posts
    438
    Thanks
    9
    Thanked 7 Times in 7 Posts
    If your curious, here is the html output:
    Code:
    <div id="myspan">
    <h3><a href="#wall" alt="" onClick="javascript:viewuserpics('user');">Pictures/Stories</a> | <a href="#wall" alt="" onClick="javascript:viewuserwall('user');">Wall</a></h3>
    <h3>user's Comments</h3>
    <p>Add a comment:</p>
    <form action="javascript:get(document.getElementById('myform'));" name="myform" id="myform">
    <textarea id="comment" cols="40" rows="10"></textarea>
    <input id="user_name" type="hidden" value="user" />			    
    <br /><input type="button" name="button" value="Add Comment" onclick="javascript:get(this.myform);">			    
    </form><br  />
    
    Pages  1 <div class="entry">
    <table><tr><td width="100" valign="top">
    <a href="viewuser.php?user_name=user"><img src="thumbs/1255023692-3266_671641343349_14800358_42187038_2646117_n.jpg"></a><div align="center"><a href="viewuser.php?user_name=user">user</a></div></td><td valign="top">
    <div style="margin-left:20px">
    Test New Comment<br>Submitted on: 10/21/2009&nbsp;11:29pm<div id="Comment19"><form>Good Comment (2) <img src="images/thumb_up.png" alt="" onClick="javascript:updatecommentvotes(19, 'Up');"> | <img src="images/thumb_down.png" alt="" onClick="javascript:updatecommentvotes(19, 'Down');"> Bad Comment (0)</form>This is test19
    				
    <form action="javascript:getsub(document.getElementById('myform_sub19'));" name="myform_sub19" id="myform_sub19">
    <textarea id="comment_sub" cols="70" rows="2"></textarea>
    <input id="comment_id_sub" type="hidden" value="19" />								
    <input id="user_name" type="hidden" value="user" />			    
    <br /><input type="button" name="button" value="Add Comment" onclick="javascript:getsub(this.myform_sub19);">			    
    </form><br  />
    </div>
    
    <div id="subcomments">
    <div class="entry3">
    <div style="margin-left:5px">
    <table width="425"><tr>
    <td width="50"><img src="thumbs/1255023692-3266_671641343349_14800358_42187038_2646117_n.jpg" height="50" width="50"><br><div align="center"><a href="viewuser.php?user_name=user">user</a></div></td><td><div style="margin-left:10px"><br>By: <a href="viewuser.php?user_name=user">user</a><br>Submitted on: 10/21/2009&nbsp;11:49pm</div></td></tr></table>
    </div></div>
    
    <div class="entry3">
    <div style="margin-left:5px">
    <table width="425"><tr>
    <td width="50"><img src="thumbs/1255023692-3266_671641343349_14800358_42187038_2646117_n.jpg" height="50" width="50"><br><div align="center"><a href="viewuser.php?user_name=user">user</a></div></td><td><div style="margin-left:10px"><br>By: <a href="viewuser.php?user_name=user">user</a><br>Submitted on: 10/21/2009&nbsp;11:37pm</div></td></tr></table></div></div><div class="entry3">
    <div style="margin-left:5px">
    <table width="425"><tr>
    <td width="50"><img src="thumbs/1255023692-3266_671641343349_14800358_42187038_2646117_n.jpg" height="50" width="50"><br><div align="center"><a href="viewuser.php?user_name=user">user</a></div></td><td><div style="margin-left:10px"><br>By: <a href="viewuser.php?user_name=user">user</a><br>Submitted on: 10/21/2009&nbsp;11:35pm</div></td></tr></table></div></div></div></div>
    </td></tr></table></div>
    
    <div class="entry">
    <table><tr><td width="100" valign="top">
    <a href="viewuser.php?user_name=user"><img src="thumbs/1255023692-3266_671641343349_14800358_42187038_2646117_n.jpg"></a><div align="center"><a href="viewuser.php?user_name=user">user</a></div></td><td valign="top">
    <div style="margin-left:20px">
    Test<br>Submitted on: 10/21/2009&nbsp;11:29pm<div id="Comment18"><form>Good Comment (1) <img src="images/thumb_up.png" alt="" onClick="javascript:updatecommentvotes(18, 'Up');"> | <img src="images/thumb_down.png" alt="" onClick="javascript:updatecommentvotes(18, 'Down');"> Bad Comment (1)</form>This is test18
    				
    <form action="javascript:getsub(document.getElementById('myform_sub18'));" name="myform_sub18" id="myform_sub18">
    <textarea id="comment_sub" cols="70" rows="2"></textarea>
    <input id="comment_id_sub" type="hidden" value="18" />								
    <input id="user_name" type="hidden" value="user" />			    
    <br /><input type="button" name="button" value="Add Comment" onclick="javascript:getsub(this.myform_sub18);">			    
    </form><br  />
    </div><div id="subcomments"></div></div>
    </td></tr></table></div>
    Pages  1 <br />
    </div>
    Last edited by treeleaf20; 10-22-2009 at 01:48 PM.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •