SitePoint Sponsor

User Tag List

Results 1 to 2 of 2

Thread: ajax form woos

  1. #1
    SitePoint Addict The Mog's Avatar
    Join Date
    Dec 2002
    Location
    Manchester UK
    Posts
    310
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    ajax form woos

    Hi all,

    I am in the process of creating a Ajax login form and have the following problem......


    Below gets the form fields sent and generates a Get URL string,
    This works fine

    Code:
    function get(obj,url,pos) {
          var getstr = "?";
          for (i=0; i<obj.childNodes.length; i++) {
             if (obj.childNodes[i].tagName == "INPUT" || obj.childNodes[i].tagName == "input") {
                if (obj.childNodes[i].type == "text") {
                   getstr += obj.childNodes[i].name + "=" + obj.childNodes[i].value + "&";
                }
       
        if (obj.childNodes[i].type == "password") {
                   getstr += obj.childNodes[i].name + "=" + obj.childNodes[i].value + "&";
                }
       
                if (obj.childNodes[i].type == "checkbox") {
                   if (obj.childNodes[i].checked) {
                      getstr += obj.childNodes[i].name + "=" + obj.childNodes[i].value + "&";
                   } else {
                      getstr += obj.childNodes[i].name + "=&";
                   }
                }
                if (obj.childNodes[i].type == "radio") {
                   if (obj.childNodes[i].checked) {
                      getstr += obj.childNodes[i].name + "=" + obj.childNodes[i].value + "&";
                   }
                }
             }   
             if (obj.childNodes[i].tagName == "SELECT") {
                var sel = obj.childNodes[i];
                getstr += sel.name + "=" + sel.options[sel.selectedIndex].value + "&";
             }
             
          }
       ajax_loadContent(pos,url + getstr);
       }
    the problem is the following .....

    HTML Code:
    <form action="javascript:get(document.getElementById('loginform'),'login.php','loginDiv');" name="loginform" id="loginform">
                        <input name="username" type="text" id="username">
                        <br>
                        <input name="password" type="password" id="password">
                        <br>
                        
            <input name="image" type="image" src="images/login_but.jpg" width="56" height="25">
                      </form>
    the above works

    But if i put the following then it doesn't work,
    it seems that the form can't have a table inside ?????
    HTML Code:
    <form action="javascript:get(document.getElementById('loginform'),'login.php','loginDiv');" name="loginform" id="loginform">
      <table width="100%">
        <tr> 
          <td>Username :</td>
          <td><input name="username" type="text" id="username"></td>
        </tr>
        <tr> 
          <td>Password :</td>
          <td><input name="password" type="password" id="password2"></td>
        </tr>
        <tr> 
          <td colspan="2"><input name="image2" type="image" src="images/login_but.jpg" width="56" height="25"></td>
        </tr>
      </table>
    </form>
    can anyone help please

    Thnaks

  2. #2
    SitePoint Wizard Pepejeria's Avatar
    Join Date
    Jan 2005
    Location
    Too far up north
    Posts
    1,566
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You can have a table inside a form, no problem. But look at your script. You are accessing child nodes of the nodes with it. The childNodes collection of the form will grow once you add the table to it.

    Use the form.elements instead of the childNodes collection to access the form elements.


Bookmarks

Posting Permissions

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