ajax xmlhttprequest

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • marymcd
    New Member
    • Mar 2010
    • 2

    ajax xmlhttprequest

    Hello,

    I am trying to fix a web/database problem (someone else wrote) and am not that familiar with Java or Ajax.

    The code opens a list when data is typed in a text input field but the "onkeyup" selection is not what is written to the database.

    For example: I type "Ma" in a text box. A list of names appears: "Maggie", "Margaret", "Mary". I click on "Mary" to select it and submit the page. When I check the data input in the database, "Ma" is what was input.

    The code looks like this:
    Code:
    <html>
    <head>
    <title>User Select</title>
    …
    <script language="JavaScript" type="text/javascript" src="ajax.js"></script>
    </head>
    
    <form action="user_save.cfm  method="post" enablecab="yes">
    <table>
    <tr><td>
    Names: <br>
    <input type="text" name="names_search" size="10" onKeyUp="xmlhttpRequest('ajax_get_names.cfm', this.value, 'names')" ><br>
    <div id="names"></div>
    </td></tr></table>
    …
    The user_save.cfm code :

    Code:
    <cfoutput>
    <cfif not isdefined("form.names_search")><cflocation url=""></cfif><br>
    </cfoutput>
    
    <cfquery name="user_save" datasource="#ds#">
    insert into dbspace.team_member
    ( member)
    value
    (
    	<cfqueryparam value = "#names_search#" cfsqltype="cf_sql_varchar">
    )
    </cfquery>
    The ajax_get_names. cfm is a <cfquery> to a person table with <select><cfoutp ut> to get the list of names form the table.

    Does anyone have any ideas?
    Last edited by Dormilich; Mar 23 '10, 03:19 PM. Reason: Please use [code] tags when posting code
  • HaLeiVi
    New Member
    • Mar 2010
    • 3

    #2
    You didn't post the source code for ajax.js. In the meanwhile, did you try it in different browsers? Try also not having it in a table. Also, how's about giving the input an id and using that instead of this.value. I've found that the 'this' keyword can make trouble sometimes in some browsers. Good luck.

    Comment

    • marymcd
      New Member
      • Mar 2010
      • 2

      #3
      I tried in a different browser with the same results. Giving the input an id and changing "this.value " to that id resulted in no names populating the selection box.

      Here is the ajax.js src code:

      Code:
      function xmlhttpRequest(strURL,strInput,strOutput) {
      	
      	var xmlHttpReq = false;
      	var self = this;
      	// Mozilla/Safari
      	if (window.XMLHttpRequest) {
      		self.xmlHttpReq = new XMLHttpRequest();
      	}
      	// IE
      	else if (window.ActiveXObject) {
      		self.xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
      	}
      	// open js window to get data
      	self.xmlHttpReq.open('POST', strURL, true);
      	self.xmlHttpReq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
      	self.xmlHttpReq.onreadystatechange = function() {
      		if (self.xmlHttpReq.readyState == 4) {
      			// update the page with the data from the called page
      			updatepage(self.xmlHttpReq.responseText,strOutput);
      		}
      	}
      	// make call to page to get data
      	self.xmlHttpReq.send(getquerystring(strInput));
      }
      // page to call
      function getquerystring(strInput) {
      	qstr = 'i=' + escape(strInput);  // NOTE: no '?' before querystring
      	return qstr;
      }
      //sends the new data to the page
      function updatepage(str,strOutput){
      	if(str.length > 10) {
      		// replace data on page with this new data
      		document.getElementById(strOutput).innerHTML = str;
      	}
      }

      Thanks for your help.
      Last edited by Dormilich; Mar 24 '10, 06:18 PM. Reason: Please use [code] tags when posting code

      Comment

      • HaLeiVi
        New Member
        • Mar 2010
        • 3

        #4
        There is nothing there to put the results into input's value. It only puts it into the DIV that you specified, 'names'.
        I'd say that you should add to the code, after calling the xmlhttpRequest function, that puts it into the DIV:
        ;this.value=nam es.innerHTML

        Comment

        Working...