dcsimg


DevX Home    Today's Headlines   Articles Archive   Tip Bank   Forums   

Results 1 to 4 of 4

Thread: pass ajax generated value in a form

  1. #1
    Join Date
    Feb 2009
    Posts
    2

    pass ajax generated value in a form

    I have two forms on a page.

    One uses ajax to generate a part number, the other emails the part number so we can reply with a quote.

    Everything works fine in FFox, but (what else is new) does not work in IE.

    To display the part number to the user, I'm using this in the JS...

    document.getElementById('myspan').innerHTML = result;

    ...and this in the html...

    <span name="myspan" id="myspan"></span>

    To get the variable in the form, I'm using this in the JS...

    document.getElementById('partnum').value= result;

    ...and this in the html...

    <input type="text" name="partnum" id="partnum" readonly>

    Here is all the relevant code...

    Code:
    <script type="text/javascript" language="javascript">
       var http_request = false;
       function makePOSTRequest(url, parameters) {
          http_request = false;
          if (window.XMLHttpRequest) { // Mozilla, Safari,...
             http_request = new XMLHttpRequest();
             if (http_request.overrideMimeType) {
             	// set type accordingly to anticipated content type
                //http_request.overrideMimeType('text/xml');
                http_request.overrideMimeType('text/html');
             }
          } else if (window.ActiveXObject) { // IE
             try {
                http_request = new ActiveXObject("Msxml2.XMLHTTP");
             } catch (e) {
                try {
                   http_request = new ActiveXObject("Microsoft.XMLHTTP");
                } catch (e) {}
             }
          }
          if (!http_request) {
             alert('Cannot create XMLHTTP instance');
             return false;
          }
          
          http_request.onreadystatechange = alertContents;
          http_request.open('POST', url, true);
          http_request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
          http_request.setRequestHeader("Content-length", parameters.length);
          http_request.setRequestHeader("Connection", "close");
          http_request.send(parameters);
       }
    
       function alertContents() {
          if (http_request.readyState == 4) {
             if (http_request.status == 200) {
                //alert(http_request.responseText);
                result = http_request.responseText;
                document.getElementById('myspan').innerHTML = result; 
                document.getElementById('partnum').value= result;
                          
             } else {
                alert('There was a problem with the request.');
             }
          }
       }
       
       function get(obj) {
          var poststr = "s=" + document.getElementById("s").value + "&it=" + document.getElementById("it").value + "&id=" + document.getElementById("id").value + "&ot=" + document.getElementById("ot").value + "&od=" +  document.getElementById("od").value + "&l=" + document.getElementById("l").value ;makePOSTRequest('post.php', poststr);
       }
    
    function blah(myform)
    {
    if (myform.s.value != '' && myform.l.value != '' && myform.it.value != '' && myform.ot.value != '' && myform.id.value != '' && myform.od.value != '' )
    myform.button.disabled = false;
    else
    myform.button.disabled = true;
    }
    
    function MM_validateForm() { //v4.0
      if (document.getElementById){
        var i,p,q,nm,test,num,min,max,errors='',args=MM_validateForm.arguments;
        for (i=0; i<(args.length-2); i+=3) { test=args[i+2]; val=document.getElementById(args[i]);
          if (val) { nm=val.name; if ((val=val.value)!="") {
            if (test.indexOf('isEmail')!=-1) { p=val.indexOf('@');
              if (p<1 || p==(val.length-1)) errors+='- '+nm+' must contain an e-mail address.\n';
            } else if (test!='R') { num = parseFloat(val);
              if (isNaN(val)) errors+='- '+nm+' must contain a number.\n';
              if (test.indexOf('inRange') != -1) { p=test.indexOf(':');
                min=test.substring(8,p); max=test.substring(p+1);
                if (num<min || max<num) errors+='- '+nm+' must contain a number between '+min+' and '+max+'.\n';
          } } } else if (test.charAt(0) == 'R') errors += '- '+nm+' is required.\n'; }
        } if (errors) alert('The following error(s) occurred:\n'+errors);
        document.MM_returnValue = (errors == '');
    } }
    </script>
    
    </head>
    <body>
    
    
    
    <form action="javascript:get(document.getElementById('myform'));" name="myform" id="myform">
    
    <!-- 6 selection boxes go here... too long to post -->
    
    <tr>
    <td colspan="2" align="center">
    <input type="submit" name="button" value="Get My Part Number" disabled="disabled" /><br /><small>(button only works once all 6 selections are made)</small>
    </td>
    </tr>
    <tr>
    <td colspan="2" align="center">
    Your Part Number is: <span name="myspan" id="myspan" style="border:1px solid #000000; padding:2px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
    </td>
    </tr>
    </table>
    </form>
    <hr>
    
    
    <!-- FORM FOR QUOTE -->
    
    <form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="POST" name="emailform" onSubmit="MM_validateForm('Firstname','','R','partnum','','R','Lastname','','R','Email','','RisEmail','Phone','','R');return document.MM_returnValue">
    <table width="100%" border="0" cellpadding="5" cellspacing="0">
    <tr>
    <td colspan="2" class="section">Get a Quote!</td>
    </tr>
    <tr>
    <td align="right"><a name="quote"></a>First Name: <input name="Firstname" type="text" id="Firstname" value="<?php echo $_POST['Firstname']?>"></td>
    <td align="right">Part Number: <input type="text" name="partnum" id="partnum" readonly></td>
    </tr>
    <tr>
    <td align="right">Last Name: <input name="Lastname" type="text" id="Lastname" value="<?php echo $_POST['Lastname']?>"></td>
    <td align="right">Your Email: <input name="Email" type="text" id="Email" value="<?php echo $_POST['Email']?>"></td>
    </tr>
    <tr>
    <td align="right" valign="top">Your Phone: <input name="Phone" type="text" id="Phone" value="<?php echo $_POST['Phone']?>"></td>
    <td align="right">Enter additional comments here...<br /><textarea name="Comment" cols=35 rows=3><?php echo $_POST['Comment']?></textarea></td>
    </tr>
    
    
    </table>
    </form>
    Like I said, all is good in FF, but I can't get the value in the form when using IE.

    What am I missing?

    Thanks!

  2. #2
    Join Date
    Mar 2009
    Location
    PA
    Posts
    8

    Just use JQuery

    I would suggest that you just use the JQuery library.
    http://jquery.com/

    I used to write out everything for AJAX the way you did, but JQuery is so simple and easy to use that I had to switch. It is intended to work in just about any browser, so it would solve your problem.

  3. #3
    Join Date
    Apr 2009
    Posts
    1

    JQuery

    I would suggest that you just use the JQuery library.
    http://jquery.com/

    I used to write out everything for AJAX the way you did, but JQuery is so simple and easy to use that I had to switch. It is intended to work in just about any browser, so it would solve your problem.

  4. #4
    Join Date
    Mar 2009
    Location
    PA
    Posts
    8

    I agree...

    I guess he seconds that...? haha

Similar Threads

  1. Replies: 2
    Last Post: 02-22-2009, 12:51 PM
  2. Pseudocode Problem
    By zobi316 in forum VB Classic
    Replies: 3
    Last Post: 03-10-2008, 07:05 AM
  3. pass two javascript form funtions - help
    By sccusandy in forum Java
    Replies: 2
    Last Post: 05-18-2006, 11:22 AM
  4. Windows form designer generated code VB
    By Benjamin in forum .NET
    Replies: 2
    Last Post: 04-05-2006, 03:06 AM
  5. Replies: 4
    Last Post: 03-12-2006, 03:12 AM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center
 
 
FAQ
Latest Articles
Java
.NET
XML
Database
Enterprise
Questions? Contact us.
C++
Web Development
Wireless
Latest Tips
Open Source


   Development Centers

   -- Android Development Center
   -- Cloud Development Project Center
   -- HTML5 Development Center
   -- Windows Mobile Development Center