I have 41 <select> fields in a form. When a user makes any selection or change to any dropdown I want to do ajax and send the values of 41 dropdown's to a php page which will compute the values and return a single value which should be displayed in a div.
View 3 RepliesI'm looking for a jQuery AJAX plugin that allows me to do the following. I have three dropdowns ( Make, Model, Year), the values of the second and third dropdowns need to dynamically changed based on the selection of the previous dropdown.
Example:
Dropdown 1
Dropdown 2 ( would change depending on selection in dropdown 1 )
Dropdown 3 ( would change depending on selection in dropdown 2 )
Is there an existing plugin that works?
I have been using PHP for a little while but just getting into JavaScript and really need to dynamically update dropdown boxes read from a mySQL database. There are three dropdown boxes, the first reads in fine. The second dropdown box then gets populated using the selection from the first as the condition in mySQL and the same again for the third.The page refreshes itself after the selection from the first box using JavaScript and populates the second using the PHP _GET method (this works fine). The issue is when I need to do this again for the second time because my JS is only set up to do it once and I don't no how to amend it. Also it will have to do it a third time because I need that info to complete the form and update the DB.
<SCRIPT language=JavaScript>
function reload(form){
var val=form.cat.options[form.cat.options.selectedIndex].value;
self.location='bookf.php?cat='+val ;
}
</script>
echo "<form method=post name=f1 action=''>";
////////// Starting of first drop downlist /////////
echo "<select name='cat' onchange="reload(this.form)"><option value=''>Select a Film</option>";
while($noticia2 = mysql_fetch_array($quer2)) {
if($noticia2['FilmID']==@$cat){echo "<option selected value='$noticia2[FilmID]'>$noticia2[FilmTitle]</option>"."<BR>";}
else{echo "<option value='$noticia2[FilmID]'>$noticia2[FilmTitle]</option>";}
}
echo "</select><br />";
////////////////// This will end the first drop down list ///////////
////////// Starting of second drop downlist /////////
echo "<select name='subcat' onchange="reload(this.form)"><option value=''>Select a Date</option>";
while($noticia = mysql_fetch_array($quer)) {
if($noticia2['FilmID']==@$cat){echo "<option selected value='$noticia2[FilmID]'>$noticia2[Date]</option>"."<BR>";}
else{echo "<option value='$noticia[FilmID]'>$noticia[Date]</option>";}
}
echo "</select><br />";
////////////////// This will end the second drop down list ///////////
////////// Starting of third drop downlist /////////
echo "<select name='subcat2' onchange="reload(this.form)"><option value=''>Select a Time</option>";
while($noticia = mysql_fetch_array($quer3)) {
if($noticia2['FilmID']==@$cat){echo "<option selected value='$noticia2[FilmID]'>$noticia2[Time]</option>"."<BR>";}
else{echo "<option value='$noticia[FilmID]'>$noticia[Time]</option>";}
}
echo "</select><br />";
////////////////// This will end the third drop down list ///////////
I have a form with two single-choice dropdowns. Upon doing an onChange event on either one of them, I want to check to see if the other dropdown has also been selected. How would I do that, considering that this.parent causes an error "null or not an object"?
View 2 Replies View RelatedDoes anyone know how to event capture on an autocomplete dropdown - this would not be the underlying html element but only on the autocomplete dropdown itself.
I've never come across trying to capture autocompletes before (in fact, ideally i'm trying to ignore keypresses on the autocomplete and only capture those for the underlying input).
How would I make my page I have connect to a database using javascript dependent dropdowns? I have all the things I need to get the database working where it displays all the info in the database but I only want it to display based on what they select not all of it.
<?php require_once('Connections/conn_dj.php'); ?>
<?php
if (!function_exists("GetSQLValueString")) {
function GetSQLValueString($theValue, $theType, $theDefinedValue = "", $theNotDefinedValue = "")
{
$theValue = get_magic_quotes_gpc() ? stripslashes($theValue) : $theValue;
$theValue = function_exists("mysql_real_escape_string") ? mysql_real_escape_string($theValue) : mysql_escape_string($theValue);
switch ($theType) {
case "text":
$theValue = ($theValue != "") ? "'" . $theValue . "'" : "NULL";
break;
case "long":
case "int":
$theValue = ($theValue != "") ? intval($theValue) : "NULL";
break;
case "double":
$theValue = ($theValue != "") ? "'" . doubleval($theValue) . "'" : "NULL";
break;
case "date":
$theValue = ($theValue != "") ? "'" . $theValue . "'" : "NULL";
break;
case "defined":
$theValue = ($theValue != "") ? $theDefinedValue : $theNotDefinedValue;
break;
}
return $theValue;
}
}
mysql_select_db($database_conn_dj, $conn_dj);
$query_rs_industry = "SELECT * FROM tbl_industry ORDER BY industry_name ASC";
$rs_industry = mysql_query($query_rs_industry, $conn_dj) or die(mysql_error());
$row_rs_industry = mysql_fetch_assoc($rs_industry);
$totalRows_rs_industry = mysql_num_rows($rs_industry);
mysql_select_db($database_conn_dj, $conn_dj);
$query_rs_productcategory = "SELECT * FROM tbl_productcat ORDER BY tbl_productcat.productCat_name";
$rs_productcategory = mysql_query($query_rs_productcategory, $conn_dj) or die(mysql_error());
$row_rs_productcategory = mysql_fetch_assoc($rs_productcategory);
$totalRows_rs_productcategory = mysql_num_rows($rs_productcategory);
mysql_select_db($database_conn_dj, $conn_dj);
$query_rs_product = "SELECT * FROM tbl_products ORDER BY tbl_products.products_name";
$rs_product = mysql_query($query_rs_product, $conn_dj) or die(mysql_error());
$row_rs_product = mysql_fetch_assoc($rs_product);
$totalRows_rs_product = mysql_num_rows($rs_product);
mysql_select_db($database_conn_dj, $conn_dj);
$query_rs_outsidena = "SELECT * FROM intl_countries ORDER BY intl_countries.name";
$rs_outsidena = mysql_query($query_rs_outsidena, $conn_dj) or die(mysql_error());
$row_rs_outsidena = mysql_fetch_assoc($rs_outsidena);
$totalRows_rs_outsidena = mysql_num_rows($rs_outsidena);
mysql_select_db($database_conn_dj, $conn_dj);
$query_rs_state = "SELECT * FROM tbl_states ORDER BY tbl_states.`state`";
$rs_state = mysql_query($query_rs_state, $conn_dj) or die(mysql_error());
$row_rs_state = mysql_fetch_assoc($rs_state);
$totalRows_rs_state = mysql_num_rows($rs_state);
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>DICKEY-john Corporation | Distributors</title>
<link href="_lib/sub.css" rel="stylesheet" type="text/css" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="keywords" content="Distributor, Sales, Purchase, U.S., International" />
<meta name="description" content="Enter your zip or postal code to find the DICKEY-john distributor nearest you." />
</head>
<body>
<div id="black"> </div>
<div id="siteContainer">
<?php include("_inc/topNav.inc"); ?>
<div id="headerContainer">Distributors</div>
<div class="divContainer"><div class="horizDiv"></div><img src="/_img/divEnd.png" alt="div" height="16" width="4" align="right" /></div>
<div id="contentContainer">
<div id="fullContainer">
<div id="stretchCrumbs">
<a href="/index.php">Home</a>
» <a class="high" href="/distributors/">Distributors</a>
</div>
<h1>Distributors</h1>
<p>Search for DICKEY-john distributers by specifying any combonation of the<br />
following classifications: industry, product category, product, and state.</p>
<br />
<br />
<h2>North America</h2>
<table class="setTbl listTbl" width="90%" cellpadding="0" cellspacing="0" border="0">
<tr><td>Industry:</td><td>
<select name="industry" id="center">
<option value="">Select an Industry...</option>
<?php do { ?>
<option value="<?php echo $row_rs_industry['industry_name']; ?>"><?php echo $row_rs_industry['industry_name']; ?></option>
<?php } while ($row_rs_industry = mysql_fetch_assoc($rs_industry)); ?>
</select></td></tr>
<tr><td width="125">Product Category: </td> <td>
<select name="prodcat" id="center">
<option value="">Select a product category...</option>
<?php do { ?>
<option value="<?php echo $row_rs_productcategory['productCat_name']; ?>"><?php echo $row_rs_productcategory['productCat_name']; ?></option>
<?php } while ($row_rs_productcategory = mysql_fetch_assoc($rs_productcategory)); ?>
</select></td></tr>
<tr>
<td>Product:</td> <td>
<select name="prod" id="center">
<option value="">Select a product...</option>
<?php do { ?>
<option value="<?php echo $row_rs_product['products_name']; ?>"><?php echo $row_rs_product['products_name']; ?></option>
<?php } while ($row_rs_product = mysql_fetch_assoc($rs_product)); ?>
</select> </td></tr>
<td>State:</td>
<td> <select name="state" id="center">
<option value="">Select a state...</option>
<?php do { ?>
<option value="<?php echo $row_rs_state['state']; ?>"><?php echo $row_rs_state['state']; ?></option>
<?php } while ($row_rs_state = mysql_fetch_assoc($rs_state)); ?>
</select></td>
</tr>
<tr><td> </td><td><input class="PythonButton" type="submit" value="Find" name="{Button_Name}"></td></tr>
</table>
</form>
<br />
<h2>Outside North America </h2>
<table class="setTbl listTbl" width="90%" cellpadding="0" cellspacing="0" border="0">
<tr><td> <select name="outna" id="center" onchange="javascript:document.centerform.submit()">
<option value="">Select a country...</option>
<?php do { ?>
<option value="<?php echo $row_rs_ousidena['name']; ?>"><?php echo $row_rs_outsidena['name']; ?></option>
<?php } while ($row_rs_outsidena = mysql_fetch_assoc($rs_outsidena)); ?>
</select></td>
</tr></td></tr>
</table>
</form>
</div>
</div>
<?php include("_inc/footer.inc"); ?>
</body>
</html>
<?php
mysql_free_result($rs_industry);
mysql_free_result($rs_productcategory);
mysql_free_result($rs_product);
mysql_free_result($rs_outsidena);
mysql_free_result($rs_state);
?>
I'm trying to get a pair of drop down menus to appear on the screen, one containing months, and one containing years. I know the one containing years works, since it hasn't been changed at all since it was working, but the month box used to be a textbox. I tried to convert it over to drop down box using the same code as the year box, but it hasn't seemed to work.
<script language="Javascript">
var m1 = January;
var m2 = February;
var m3 = March;
var m4 = April;
var m5 = May;
var m6 = June;
var m7 = July;
var m8 = August;
var m9 = September;
var m10 = October;
var m11 = November;
var m12 = December; .....
document.write('<select name="selYear">');
for (var x=0; x <= 10; x++ ) {
if(x != 5){
document.write('<option value="' + x + '">' + yearArray[x] + '</option>');
}else{
document.write('<option value="' + x + '" selected>' + yearArray[x] + '</option>');
}} document.write('</select>');
</SCRIPT>
I am in a problems here trying to generate link by two dropdown boxes. So, I wanted it to be like when user selects some option from dropdown one the href attribute changes, index.php?staticvar=something&dynvar1=something, that is something I have already managed to do:
function change_href(id)
{
if (id != '')
{
var dynvar1 = document.getElementById("s"+id).value;
document.getElementById(id).href = "index.php?staticvar="+id+"&dynvar1="+dynvar1;
return;
}
else
{
return false;
}
}
This works perfectly for me, but now I need to modify the href with another variable, so it would be needed to be like:
index.php?staticvar=something&dynvar1=something&dynvar2=something2
The problem is that I don't know how to make it the way that user can change their selections, for example if user first selects (from dropdown) dynvar1 to be "test" and dynvar2 to be "test3", but then changes hes mind and decides to re-select dynvar2 to be "test4". It would be needed to be like only the dynvar2 part of the href changes with proper value (not changing the dynvar1 or staticvar).
I managed to make it changeable but it was like this:
index.php?staticvar=something&dynvar1=something&dynvar2=123&dynvar2=123
So, it didn't update the dynvar2 part, but instead just added another dynvar2 variable.
I am looking for the ability to add dropdowns (B, C, D etc) dynamically when one of the option in dropdown (a) is chosen.
View 1 Replies View RelatedI have 2 different dropdowns lists. One for the month and another for the days (shows the date)
by default when the page is loaded, I am showing January in the first dropdown and 1 in the second dropdown (date).
But if a user selects February from the month dropdown list, I just dont want to show 29th, 30th, 31st etc. Same applicable for say april, june, sept etc where I dont want to show 31st so the user will not be able to select wrong date for a month. How can I do this?
The datepicker is connected to three fields (drop downs for..) [Month]/[Day]/[Year]-[Datepicker(Calendar)] now I just wanted to get the dropdowns' values and pass it on a textbox (namely: selectedDate - you can see below) having a format of [mm/dd/yyy]
Code from [url]
Update three select controls to match a datepicker selection
The Dropdowns:
i found this sample code
Code:
<script>
function setOptions(chosen) {
var selbox = document.myform.opttwo;
selbox.options.length = 0;
if (chosen == " ") {
selbox.options[selbox.options.length] = new Option('Please select one of the options above first'
[Code]...
I am using the following code to show / hide form elements within a div based upon the drop down choice. How this code can be amended to use multiple drop downs within one form?
HTML Code:
<html><head>
<title>Show and Hide</title>
<script>
// Function that Shows an HTML element
function showDiv(divID){
var div = document.getElementById(divID);
div.style.display = ""; //display div
}
// Function that Hides an HTML element
function hideDiv(divID){
var div = document.getElementById(divID);
div.style.display = "none"; // hide
} .....
I've got a form which I want to validate using jQuery to ensure that the same value for a dropdown has not been entered more than once. The form consists of the following:
Code HTML4Strict:
<li class="clonedInput" id="input1">
Name:
<select id="player[1][userid]" name="player[1][userid]"></select>
<select class="hours" id="player[1][hours]" name="player[1][hours]"></select>
<select class="mins" id="player[1][mins]" name="player[1][mins]"></select>
[Code]...
refer to following link and you will see first item/option of the first dropdown is being displayed as selected value of other dropdowns. [URL]
View 1 Replies View RelatedI want to make two Dropdown but should be linked with each other.
There value should change after click "go" button.
In other word I want to make one html for Post Code/Pin Codes of my state.
I have made script till here:
I'm creating an AJAX page that is built using a PHP Class, ie the php looks a bit like this: PHP Code:
$wp_page->addjs('../var/savepolicies.js')
$wp_parser->page = "userpolicywindow.php";
$wp_parser->addlink("Home","../index.php","");
$wp_parser->addlink("Logout","javascript:logout();","");
$wp_parser->getpageid("501");
[Code]...
within this page that has been created, there is an AJAX tree folder which calls another page to be loaded into a DIV by AJAX again. Code:
[Code]...
I don't know why it doesn't work because the page has been loaded with the JS file, but as soon as the link is added afterwards it doesn't work. I take it this is because it doesn't know where to find the JS, but how can I overcome this?
jquery provides ajaxStart() and ajaxStop() events. Those two events do not seem to be triggered if the ajax requests are made by Microsoft Ajax tool Kit (from ASP.Net code). Is there any way to bridge those two event models? If not currently possible, is there any future initiative or plan out there to make this happen?
View 2 Replies View Relatedi was using $.ajax method to get my ajax page on my main page,which is working great.But now if i have links in that ajax page then i can't open them in that same div,the links are opening in new window,but i want to open in same part,i tried google it and then found, i have to use iframe instead of div.how to do with only use jquery and div.
View 3 Replies View Relatedi have a series of <select> fields. The first one, via ajax(), generates a 2nd one, based on the first ones' data with the .change() method. there is then a 3rd <select> - who's data will depend on choice of the second one although step 1 works, and i can generate the 2nd one, i still can't generate the 3rd one.
when i test the script on its own, both the 2nd and 3rd <select> fields are fine - but not via the ajax, which leads me to believe that the .change() from the 2nd one, isnt triggering the ajax call - its not being picked up (even the 'hello' alert isnt working).
[Code]...
I am using jquery for getting ajax responses from server side functions.
I am in a situation where I need to make two ajax calls one after another and the second one is dependent on the response of the first one.
I have tried to use a code which is similar to this one?
$.ajax({
type: 'GET',
url: 'myURL',
success: function(data)
[Code]....
Is it possible to get two have two ajax calls , one dependent on the other?
Am calling Webservice in one ajax post, In the success funtion am calling another another method in same webservice through another ajax post method. First ajax post is getting called and returning the string from the webservice method but the inner ajax call is not getting called. I have placed the code here.
[Code]...
Am trying to set up a very simple AJAX script for my website. The
javascript i have in an external file which reads as below.
This works perfectly in firefox but IE doesn't display anything at all.
No error messages, just a blank IE window. If you look at the IE source
this html is all there it just won't show it! Code:
I was playing a little bit with a lot of ajax frameworks. I have even
wrote one small by myself. But one thing still drives me crazy: Whenever
I'm doing an ajax call I need to specify handler to handle data coming
from a server script. That means that almost for every action I need two
functions.
Since I'm still new to all of this I'd like to ask how can i achieve
something like this:
function function_name(el) {
var i_need_this = get_what_i_need(el.id);
return _i_need_this;
}
where get_what_i_need function is returning some information using ajax
from a server.
I want to update part of a XML output (generated by Perl CGI). I'm using XSL to transform the XML.
Can I use this approach?
I need to resort the contents of a table, that gives me the results
from a query, when someone clicks on one of the names of that table.
Is there any books i can buy from local shops or any websites that can help you learn the basics up to advanced ajax?
View 8 Replies View Related