simple ajax call

Hello Folks,
All I am trying to do is assign the ajax response to some div or hidden element on the page and display it as an alert.
But it is not working it right.
Please can you have a look into this
Thanks
Sam
LVL 8
newbie27Asked:
Who is Participating?
 
hieloConnect With a Mentor Commented:
This:
var sRefNumbers = $("#listRefnos").val();
var sViewQuery = "SF1=keyword&ST1="+sRefNumbers;  

needs to be executed within the onSuccess callback function of the  ajax request you are making in getListRefs(), NOT within viewList()

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
	"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
	
<html xmlns="http://www.w3.org/1999/xhtml" version="-//W3C//DTD XHTML 1.1//EN" xml:lang="en">
<head>
<base href="http://213.253.134.6/artism/admin/list_try.asp"/>
<title>ehaus Content Administration :: </title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<meta name="author" content="ehaus ltd" />
<meta name="copyright" content="copyright www.ehaus.co.uk" />
<meta name="description" content="ehaus Content Administration" />
<meta name="keywords" content="" />
<meta name="robots" content="all" />
 
<script type="text/javascript" src="include/menu.js"></script>
<script type="text/javascript" src="include/jquery/jquery-1.2.3.min.js"></script>
<script type="text/javascript" src="include/jquery/jquery.cookie.js"></script>
<script type="text/javascript" src="include/flexigrid/flexigrid.js"></script>
<script type="text/javascript" src="include/jquery/jquery.jeditable.js"></script>
<script type="text/javascript" src="lists/include/list_script.js"></script>
 
<script type="text/javascript">
 function repopulateList()
{
	$.ajax({
	  type: "POST",
	  url: "list_builder.asp",
	  data: "action=save&listname="+$("#txtListName").val(),
	  success: function(msg)
	  		{
	  			var re = /[<]script[>]([^<]+)[<][\/]script[>]/ig;
				msg.match(re);
				msg = msg.replace(re,"");
				$("#theList").html( msg );								
				eval(RegExp.$1);
			}
	});
}
 
function getListRefs(sListname)
{
	$.ajax({
	  type: "POST",
	  url: "list_builder.asp",
	  data: "action=results&listname="+sListname,
	  success: function(msg)
	  		{					
				$("#listRefnos").val( msg );		
	
				var sRefNumbers = $("#listRefnos").val();
				var sViewQuery = "SF1=keyword&ST1="+sRefNumbers;     
				alert("sViewQuery: "+sViewQuery);
			}
	/* success: function(xml){
                                var errCode = $("errorcode", xml).text();
                                var errMsg = $("errormsg", xml).text();
                                var resTxt = $("responsetext", xml).text();
                                if(errCode == 0){
									$('#listRefnos').val(resTxt);
                                }
                            }  
	*/		
	});
} 
 
$(document).ready(function()
{
	repopulateList();
});
 
function viewList()
{
	var sListname = $("#drpLists").val();
  
	if(sListname == 0 || sListname == "new")
	{
		alert('Please select a list');
	}
	else
	{
		alert("viewList: "+sListname);
		getListRefs(sListname);	
  }}
</script>
 
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
<link rel="stylesheet" type="text/css" href="styles/screen.css" />
 <link rel="stylesheet" type="text/css" href="include/flexigrid/flexigrid.css">
<!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="styles/screen_ie6.css" />
<![endif]-->
 
</head>
<body>
<a name="top"></a>
<div id="header">
	<h1><a href="index.asp?">ehaus - Content Manager</a></h1>
</div>
 
<div id="breadcrumb">
	Administration: <a href="index.asp?">Home</a> > 
	<a href="search.asp?">Search</a> > 
	Search Results 
	 
	
 
</div>
<!-- search here -->
 
 
 
<div id="wrapper">
	
<div id="pagetitle">
	<h2>Website Administration: </h2>
	<ul>
		<!--<li class="email">someone@oecd.org</li>-->
		<li><a href="javascript:openWindow('popup_help.asp?hs=/artism/admin/list_try.asp','childwin',450,650);" >Help</a></li>
		<li><a href="/webauth.asp?lgt=Y">Sign Out</a></li>
	</ul>
</div>
	<div id="leftcol">
		<h3>Main Menu</h3>
	<ul id="treemenu1" class="treeview">
	<li class="topmenu"><div><a href="index.asp?">Home</a></div></li>
 
</ul>
 
	
		<!-- SubMenus -->	
		<h3>Display Options</h3>
		<ul class="leftmenu">
			
		<!-- FORMAT FORM START -->
		<!--
		<form name="frmFormat" id="frmFormat">
			<span class="greyheading"><b></b></span>
			<select name="sort" id="sel2" onChange="if(document.frmFormat.sel2.selectedIndex!=0) document.location.href=document.frmFormat.sel2.options[document.frmFormat.sel2.selectedIndex].value">
			<option value="">Select Format..</option>
			<option value="results.asp?">Title</option>
			<option value="results.asp?">ISBN</option>
			</select>
			<script language="JavaScript">document.frmFormat.sel2.selectedIndex=0;</script>
		</form>	
		-->
		<!-- FORMAT FORM END -->
	
		<li><a href="rdbm_results.asp?">Default layout</a></li>
		<li><a href="rdbm_results.asp?">Company layout</a></li>	
 
 
			
			
		</ul>
		 <div id="responsemsg" style="float:left;font-weight:bold;color:#a0162f;"></div>  
	
	  
	   <h3>Short List</h3>
	  
		 	<!-- include file="lists/include/list_nav.asp" -->
	<!-- /SubMenus -->	
	</div>
	<div id="content">
	<h3>List Manager:</h3> 
 
	 <form name="frmList" id="frmList" action="list_save_proxy.asp" method="post">  
	 <div id="responsemsg" style="float:left;font-weight:bold;color:#a0162f;"></div>  
			
        <input type="hidden" name="action" id="action" value="savefields" />
	    <input type="hidden" name="filename" id="filename" value="test@test.com"/>
		<input type="hidden" name="hiddflag" id="hiddflag" value=""/>
	    <!--input type="hidden" name="refnos" id="refnos" /-->
		<input type="hidden" name="listRefnos" id="listRefnos">
      <div id="listRefnos" style="float:left;font-weight:bold;color:#a0162f;"></div>
      
      <INPUT type="hidden" name="hidList" id="hidList" value=""/>
	  
				Save Into <span id="theList"> </span><a href="javascript:viewList();" class="button">View List</a>&nbsp; &nbsp; &nbsp;
				           </td></tr>
						   
						   </table>							
	  </form>  
	
	   <div style="float: left;"></div>
		 
	
	</div><!-- content -->
	
<div style="clear: both;"></div><br />
	<div id="footer">
		<ul>
			<li><a href="http://www.ehaus.co.uk" target="_blank">Copyright &copy; Ehaus Ltd.</a></li>
			<li><a href="index.asp?">Home</a></li>
			<li><a href="contact.asp?" class="last">Contact us</a></li>
		</ul>
	</div>	
 
</div><!-- wrapper -->
 
<script type="text/javascript">
//ddtreemenu.createTree(treeid, enablepersist, opt_persist_in_days (default is 1))
ddtreemenu.createTree("treemenu1", true)
ddtreemenu.createTree("treemenu2", false)
</script>
</body>
</html>

Open in new window

0
 
newbie27Author Commented:
I am returning result to this  $('#listRefnos').html(resTxt); but when I want to retrieve it from here

this did not worked..
var sRefNumbers = $("#listRefnos").val();

please can someone advice ....
thanks

<input type="hidden" name="listRefnos" id="listRefnos">
OR
 <div id="listRefnos" style="float:left;font-weight:bold;color:#a0162f;"></div>
     
<script type="text/javascript">
  
$(document).ready(function()
	{
  repopulateList();
 
  });
  function viewList(){
  var sListname = $("#drpLists").val();
  
  if(sListname == 0 || sListname == "new"){  
    alert('Please select a list');
  }else{
   alert(sListname);
	getListRefs(sListname);	
	
	var sRefNumbers = $("#listRefnos").val();
	
	  
    var sViewQuery = "SF1=keyword&ST1="+sRefNumbers;     
    alert(sViewQuery);
  }}
</script>
 
 
function repopulateList()
{
	$.ajax({
	  type: "POST",
	  url: "list_builder.asp",
	  data: "action=save&listname="+$("#txtListName").val(),
	  success: function(msg){
							$("#theList").html( msg );								
                            }
    });
}
 
 
function getListRefs(sListname)
{
	$.ajax({
	  type: "POST",
	  url: "list_builder.asp",
	  data: "action=results&listname="+sListname,
	//  success: function(msg){					
		//					$("#responsemsg").val( msg );		
			//				}
	 success: function(xml){
                                
                                var errCode = $("errorcode", xml).text();
                                var errMsg = $("errormsg", xml).text();
                                var resTxt = $("responsetext", xml).text();
                                
                                if(errCode == 0){
									$('#listRefnos').html(resTxt);
											
                                }
                            }  		
	});
} 

Open in new window

0
 
newbie27Author Commented:
it is picking up the values but apparently not the current one, it is showing the one previously selected !
if you please go to this page, and try to chose any value from the list .....

http://213.253.134.6/artism/admin/list_try.asp
0
 
gops1Connect With a Mentor Commented:
I guess, it works. Its a matter of time i.e. the response time. You need to have a wait time and give some time for the response the reach the client.

You can do these things is onchange of the dropdown:
1. Clear the old value stored in the
2. Disable the view button
3. Enable the view button when the response is ready
4. [Optional] You can provide a animation that indicates there is some process happening when the dropdown value is changed.
0
 
newbie27Author Commented:
thanks hielo.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.