|
JavaScript - Advanced Javascript - Prepopulate Fields Using Url
I have used a Javascript to prepopulate text fields and checkbox's etc. However I can't make it populate a text area. Would anyone be kind enough to help me with the code for it?
Any help would really be appreciated: (source code below) Code: // preset.js Copyright 2009 by Richard L. Trethewey - All Rights Reserved
// Permission is granted to use this code as long as this copyright notice
// is left intact. For more information, see http://www.rainbodesign.com/pub/
// First, get the query string contents from the URL used by lopping off the "?"
var query = location.search.substr(1, location.search.length-1);
function findForm(theForm) {
var formCount = document.forms.length;
if (document.getElementById) { formElement = document.getElementById(theForm);
} else {
for (i=0; i<formCount; i++) {
if (document.forms[i].name == theForm) { formElement = document.forms[i]; }
} // endFor
} // endif document.getElementById
return formElement;
} // end findForm
function setOption(theOption,choice) {
max = theOption.length;
for (i = 0; i < max; i++) {
if (theOption.options[i].value == choice) { theOption.options.selectedIndex = i; }
} // end for i
} // end setOption
function setRadio(theOption,optionName) {
max = theOption.length;
for (i = 0; i < max; i++) {
// alert(theOption[i].name + ' ' + theOption[i].checked);
if (theOption[i].value == optionName) { theOption[i].checked = true; }
} // end for i
} // end setRadio
function fixQString(theStr) {
pattern = '\\+';
flags = 'g';
reg_exp = new RegExp(pattern, flags);
theStr = theStr.replace(reg_exp, ' ');
theStr = unescape(theStr);
return theStr
} // end fixQStr
function populate(formName) {
if (query) { // Was there a query string?
var params = query.split("&"); // Yes! Split them up
var theForm = findForm(formName); // Locate the form with the correct name/ID
if (theForm != null) { // Did we find the form?
for (q=0; q<params.length; q++) {
xy = params[q].split("="); // Split the command into name/value pair
paramName = xy[0];
newValue = fixQString(xy[1]);
if (theForm.elements[paramName]) { // does named element exist?
// alert(theForm.elements[paramName].type + ' ' + paramName);
switch(theForm.elements[paramName].type) {
case 'text':
theForm.elements[paramName].value = newValue;
break;
case 'hidden':
theForm.elements[paramName].value = newValue;
break;
case 'select-one':
setOption(theForm.elements[paramName], newValue);
break;
case undefined: // a kludge to handle radio buttons
setRadio(theForm.elements[paramName], newValue);
break;
case 'checkbox':
theForm.elements[paramName].checked = true;
break;
} // end switch
} // endif theForm.elements[paramName]
} // end for q
} // endif {theForm)
} // endif (query)
} // end populate()
Similar TutorialsHello, I have a survey with hundred of input boxes. I want to make a script that will validate all fields not empty and maybe jump to the empty box. I made the validation with php but i'm not so good at javascript (if is possible to validate by input not by input name). Thank in advance. Ok, this is going to be a bit of an off the wall question and I'm not sure if it can even be done, but what I'm trying to do is prefill a form in an external iframe. The text fields in form that is in the external iframe all have a name of "U2FsdGV + a random generated string". There are 5 text fields all following the same pattern, I would like for it to post the value 1 in the first wildcard case it detects, then value 2 in the 2nd, etc... Here is my code so far: PHP Code: <script> function load() { var btn = document.getElementById('btnTest'); btn.onclick = function(){ var ifrm = document.getElementById('myiframe'); ifrm.contentWindow.document.forms['postingForm'].U2FsdGV*.value = 'Hello world!'; }; } window.onload = load; </script> Hi, jI have a javascript script that adds/deletes input in a form. I'd like to calculate the volume for each ligne : l*h*d Then a total of all the volume fileds The data will be inserted in a php table. Thanks for your help (I hope you can understand my english) I have trouble with php but even more with javascript versions. PHP Code: -- Structure of mysql table named 'tbox' -- CREATE TABLE IF NOT EXISTS 'tbox' ( 'tboxid' int(11) NOT NULL AUTO_INCREMENT, 'tboxidtproid' int(11) NOT NULL, 'tboxdate' date NOT NULL, 'tboxL' int(11) NOT NULL, 'tboxD' int(11) NOT NULL, 'tboxH' int(11) NOT NULL, 'tboxnet' float NOT NULL, 'tboxgros' float NOT NULL, PRIMARY KEY ('tboxid') ) ENGINE=MyISAM DEFAULT CHARSET=utf8 AUTO_INCREMENT=55 ; The html page wiith js : PHP Code: <html> <head> <script type="text/JavaScript"> // add a box <!-- function create_champ(i){ var l = document.getElementById('l_1').value; var d = document.getElementById('d_1').value; var h = document.getElementById('h_1').value; var v = document.getElementById('v_1').value = (l * d * h) ; var i2 = i + 1; document.getElementById('champs_'+i).innerHTML = '<span id="ligne_'+i+'">L <input type="text" size="9" maxlength="9" name="l[]" id="l_'+i+'" \/> D <input type="text" size="9" maxlength="9" name="d[]" id="d_'+i+'" \/> H <input type="text" size="9" maxlength="9" name="h[]" id="h_'+i+'" \/> Volume : <input type="text" size="9" maxlength="50" name="v[]" id="v_'+i+'" value = "" " disabled="true" \/> <input type="button" value="x" id="boutton_'+i+'"onclick="delete_champ('+i+')" \/><br \/><\/span>'; document.getElementById('champs_'+i).innerHTML += '<span id="champs_'+i2+'"><input type="button" value="Add a box" onclick="create_champ('+i2+')" \/><\/span>'; } function delete_champ(i){ document.getElementById("ligne_"+i).innerHTML=""; } </script> </head> <body> <form id="1" name="addalbum" method="post" action=""> <td width="250" valign="top"><fieldset> <legend>Boxes Dimensions(mm)</legend> <table width="95%" border="0" cellspacing="0" cellpadding="3"> <tr> <span id="ligne_1"> L <input type="text" name="l[]" id="l_1" size="9" maxlength="9" value="" /> D <input type="text" name="d[]" id="d_1" size="9" maxlength="9" value="" /> H <input type="text" name="h[]" id="h_1" size="9" maxlength="9" value="" /> Volume : <input type="text" name="v[]" id="v_1" size="9" maxlength="9" value="" disabled="true" /> <input type="button" value="x" id="boutton_1" onclick="delete_champ(1)" /> <br /> </span> <span id="champs_2"> <input type="button" value="Add a box" onclick="create_champ(2)" \/></span> </table> </fieldset></td> <label> <input type="submit" name="button" id="button" value="Envoyer"> </label> </form> <?php /* insert fields in table tbox */ ?> </body> </html> I'm trying to understand how forms, data, php, javascript all work together. So 1) I hardcoded some html form fields with values using php using "echo", then 2) I dynamically created some more html form fields with values using javascript using "createElement" and appending to the html form element. When I click on the submit form, the php created form fields still show on the webpage, but the javascript dynamically created form fields disappear. Can anyone shed some light for me? Why are the javascript created form fields disappearing when I click on submit and not the PHP created form fields? Thank you! Code: <form method="post" id="commentform" action="<?php echo $PHP_SELF?>"> Ok so Im going to break down what Im trying to do and hopefully someone can point me to a possible solution without getting all technical. I have 2 div tags. the first is a content container more or less. the second is a container for a php built calender (using html tables). Basically when the page loads the php builds the calenders html table code. each td element has an onclick event handler. The goal is to have the javascript handler execute when any non empty cell is clicked (non empty being that it has a date associated with it and is not a blank space filler). This is the easy part. The hard part is that each calendar day potentially has certain information associated with it stored in a mysql database. Im wanting input fields within the first container div to autopopulate with the information from the database (if any) for whatever day is clicked. Ive search around and heard things like javascript cant do mysql queries directly, and heard mention of ajax. So im stumped as to how to accomplish this. whether i need an external php script for the queries (perhaps inside a php function that can return data to the javascript that calls it?), but if that is plausable would it cause page loads or the like to the user? i really dont want to have to learn ajax for this one page, just seems excessive, but i do need a way to make the content in the first div populate with the respective database data for the selected day on the calendar. any thoughts, comments, or solutions that dont involve yet another web language would be greatly appreciated. thanks
Afternoon All, I have managed to secure some JavaScript code from another site that allows me to access values from within my Google Analytics cookie: <!-- begin Referer Check --> <script type="text/javascript"> var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www."); document.write("<script src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'>" + "</sc" + "ript>"); </script> <script type='text/javascript'> var pageTracker = _gat._getTracker("UA-1-1"); pageTracker._trackPageview(); // // This is a function that I "borrowed" from the urchin.js file. // It parses a string and returns a value. I used it to get // data from the __utmz cookie // function _uGC(l,n,s) { if (!l || l=="" || !n || n=="" || !s || s=="") return "-"; var i,i2,i3,c="-"; i=l.indexOf(n); i3=n.indexOf("=")+1; if (i > -1) { i2=l.indexOf(s,i); if (i2 < 0) { i2=l.length; } c=l.substring((i+i3),i2); } return c; } // // Get the __utmz cookie value. This is the cookies that // stores all campaign information. // var z = _uGC(document.cookie, '__utmz=', ';'); // // The cookie has a number of name-value pairs. // Each identifies an aspect of the campaign. // // utmcsr = campaign source // utmcmd = campaign medium // utmctr = campaign term (keyword) // utmcct = campaign content // utmccn = campaign name // utmgclid = unique identifier used when AdWords auto tagging is enabled // // This is very basic code. It separates the campaign-tracking cookie // and populates a variable with each piece of campaign info. // var source = _uGC(z, 'utmcsr=', '|'); var medium = _uGC(z, 'utmcmd=', '|'); var term = _uGC(z, 'utmctr=', '|'); var content = _uGC(z, 'utmcct=', '|'); var campaign = _uGC(z, 'utmccn=', '|'); var gclid = _uGC(z, 'utmgclid=', '|'); // // The gclid is ONLY present when auto tagging has been enabled. // All other variables, except the term variable, will be '(not set)'. // Because the gclid is only present for Google AdWords we can // populate some other variables that would normally // be left blank. // if (gclid !="-") { source = 'google'; medium = 'cpc'; } // Data from the custom segmentation cookie can also be passed // back to your server via a hidden form field var csegment = _uGC(document.cookie, '__utmv=', ';'); if (csegment != '-') { var csegmentex = /[1-9]*?\.(.*)/; csegment = csegment.match(csegmentex); csegment = csegment[1]; } else { csegment = '(not set)'; } // // One more bonus piece of information. // We're going to extract the number of visits that the visitor // has generated. It's also stored in a cookie, the __utma cookis // var a = _uGC(document.cookie, '__utma=', ';'); var aParts = a.split("."); var nVisits = aParts[5]; /* function populateHiddenFields(f) { f.source.value = source; f.medium.value = medium; f.term.value = term; f.content.value = content; f.campaign.value = campaign; f.segment.value = csegment; f.numVisits.value = nVisits; alert('source='+f.source.value); alert('medium='+f.medium.value); alert('term='+f.term.value); alert('content='+f.content.value); alert('campaign='+f.campaign.value); alert('custom segment='+f.segment.value); alert('number of visits='+f.numVisits.value); return false; } */ document.forms["cforms2"].elements["cf2_field_1"].value = source; </script> The key outputs from this code are the vars: source medium term content campaign csegment nVisits My question is, how can I get the source var into the hidden field in the form in my footer http://www.yogaholidays.co? I have tried to pass just the source var from within the <script> tags. document.forms["cforms2"].elements["cf2_field_1"].value = source; I have commented out part of original code that I did not think I needed. Any help that can be offered I would be grateful, ultimately I would like to be able to pass all these values to hidden fields. Thanks Paul Brown I type something on the current textarea/input and all the values get removed after I add another field. Is there a solution? Code: <script language="Javascript" type="text/javascript">
<!--
//Add more fields dynamically.
function addField(area,field,limit) {
if(!document.getElementById) return; //Prevent older browsers from getting any further.
var field_area = document.getElementById(area);
var all_inputs = field_area.getElementsByTagName("input"); //Get all the input fields in the given area.
//Find the count of the last element of the list. It will be in the format '<field><number>'. If the
// field given in the argument is 'friend_' the last id will be 'friend_4'.
var last_item = all_inputs.length - 1;
var last = all_inputs[last_item].id;
var count = Number(last.split("_")[1]) + 1;
//If the maximum number of elements have been reached, exit the function.
// If the given limit is lower than 0, infinite number of fields can be created.
if(count > limit && limit > 0) return;
//Older Method
field_area.innerHTML += "<li><textarea id='steps' name='steps[]' rows='5' cols='40'></textarea><br /><input id='steps_image' name='steps_image[]' /></li>";
}
//-->
</script>
<ol id="steps_area"><li>
<textarea id='steps' name='steps[]' rows='5' cols='40'></textarea><br /><input id='steps_image' name='steps_image[]' />
</li>
</ol>
<input type="button" value="Add" onclick="addField('steps_area','',15);"/>
The page loads and existing data is put in their correct fields. When I click 'add more' to add more fields to the form it does so and I am able to add new data. If on adding a new fields and its data I click 'add more' again it clears out the recently added data from the fields. The existing data that was present when the page first loaded is still their but all the new fields added data is cleared. how can I get it so the data stays, like in phpmyadmin when adding new fields. JS Code: function addmore(addwhat) {
// count existing boxes to find out next number to use.
// ?
if (addwhat == 'addresses') {
fieldid = 'addressesdiv';
}
if (addwhat == 'namesnumbers') {
fieldid = 'namesdiv';
}
var dv = document.getElementById(fieldid).innerHTML;
var lines = dv.match(/<br>/ig).length;
if (addwhat == 'addresses') {
document.getElementById('addressesdiv').innerHTML += '<textarea name="address' + lines + '" cols="30" rows="2"></textarea><br>';
}
if (addwhat == 'namesnumbers') {
document.getElementById('namesdiv').innerHTML += '<textarea name="name' + lines + '" cols="30" rows="2"></textarea><br>';
document.getElementById('mobilesdiv').innerHTML += '<textarea name="mobile' + lines + '" cols="30" rows="2"></textarea><br>';
}
}
PHP Code: <?
if ($_POST['Submit'] == 'Submit') {
echo("sent<br>");
for ($c = 1; $c <= (count($_POST)-1)/2; $c++) {
echo("name" . $c . " = " . $_POST['name'.$c] ." mobile" . $c . " = " . $_POST['mobile'.$c] . "<br>");
}
}
$customer_id = "11";
// get existing data.
// if not yet sent get data from databases
$ok = "no";
if ($_POST['Submit'] != "Submit") {
echo("<br>not sent<br>");
$res = db_query("SELECT * FROM `customer_client_names` WHERE `customer_id` = '". $customer_id ."'");
$maincount = mysql_num_rows($res);
echo("<br>number of clients = ".$maincount."<br>");
for ($c = 1; $c <= $maincount; $c++) {
$_POST['name'.$c] = mysql_result($res, $c-1, "client_name");
$_POST['mobile'.$c] = mysql_result($res, $c-1, "client_mobile");
echo("cn = ".$_POST['name'.$c] . " cm = ".$_POST['mobile'.$c] . "<br>");
}
} else {
// display last posted info
echo("<br>sent<br>");
$ok = "yes";
// check if info was entrted correctly or not.
for ($c = 1; $c <= ((count($_POST)-1)/2); $c++) {
if ($_POST['name'.$c] != "" && $_POST['mobile'.$c] == "") {
echo("<br>" . $_POST['name'.$c] ." was not given a mobile number<br>");
$ok = "no";
$maincount ++;
}
if ($_POST['name'.$c] == "" && $_POST['mobile'.$c] != "") {
echo("<br>" . $_POST['mobile'.$c] ." mobile was not given a name<br>");
$ok = "no";
$maincount ++;
}
}
}
if ($ok == "no") {
?>
<form name="form1" method="post" action="?ac=<?=$menu_item;?><? echo("&phpsession=" . $phpsession); ?>">
<div style="width: 850px;">
<div id="namesdiv" style="float: left; padding-right: 10px;">Client's Names<br>
<? for ($c = 1; $c <= ((count($_POST)-1)/2)+1; $c++) {
if ($_POST['name'.$c] != "" || $_POST['mobile'.$c] != "") {
?>
<textarea name="<?='name'.$c;?>" cols="30" rows="2"><?=$_POST['name'.$c];?></textarea><br>
<?
}
} ?>
</div>
<div id="mobilesdiv" style="float: left;">Client's Mobile numbers<br>
<? for ($c = 1; $c <= ((count($_POST)-1)/2)+1; $c++) {
if ($_POST['name'.$c] != "" || $_POST['mobile'.$c] != "") {
?>
<textarea name="<?='mobile'.$c;?>" cols="30" rows="2"><?=$_POST['mobile'.$c];?></textarea><br>
<?
}
} ?>
</div>
</div>
<br style="clear: both;">
<a href="#" onClick="javascript:addmore('namesnumbers'); return false;" >Add more</a>
<input type="hidden" name="customer_id" value="<?=$customer_id;?>">
<input type="submit" name="Submit" value="Submit">
</form>
<?
}
?>
So, I don't know if javascript is not able to calculate this but I would like to know if it's possible here is the formula: Monthly Payment = premium x [(0.006(1.006)^term)/((1.006)^term-1)]; Here is the same function with values. 2131.33 = 6383.40 x [(0.006(1.006)^3)/((1.006)^3-1)]; I haven't been able to make it come out correctly yet. Is it even possible? I am working on a page where the user will select a location from a dynamically generated dropdown list. I was able to create the php multidimensional array (tested and working) from a MySql database using the users information at login, but I'm having problems converting it to a javascript multidimensional array. I need to be able to access variables that I can pass to a number of text fields within an html form. For instance, if a user belongs to a company with multiple addresses, I need to be able to let them select the address they need to prepopulate specific text fields. php array creation: Code: if ($row_locations)
{
while ($row_locations = mysql_fetch_assoc($locations))
{
$mail[$row_locations['comp_id']]=array('mailto'=>$row_locations['mailto'], 'madd'=>$row_locations['madd'], 'madd2'=>$row_locations['madd2'], 'mcity'=>$row_locations['mcity'], 'mstate'=>$row_locations['mstate'], 'mzip'=>$row_locations['mzip'], 'billto'=>$row_locations['billto'], 'badd'=>$row_locations['badd'], 'badd2'=>$row_locations['badd2'], 'bcity'=>$row_locations['bcity'], 'bstate'=>$row_locations['bstate'], 'bzip'=>$row_locations['bzip']);
}
}
javascript function - this should create the array and send variables to text fields. Code: function updateAddress() {
var mail = $.parseJSON(<?php print json_encode(json_encode($mail)); ?>);
{
if (comp_id in mail) {
document.getElementById('mailto').value=mail.comp_id.mailto.value;
document.getElementById('madd').value=mail.comp_id.madd.value;
document.getElementById('madd2').value=mail.comp_id.madd2.value;
document.getElementById('mcity').value=mail.comp_id.mcity.value;
document.getElementById('mstate').value=mail.comp_id.mstate.value;
document.getElementById('mzip').value=mail.comp_id.mzip.value;
} else {
document.getElementById('mailto').value='';
document.getElementById('madd').value='';
document.getElementById('madd2').value='';
document.getElementById('mcity').value='';
document.getElementById('mstate').value='';
document.getElementById('mzip').value='';
}
}
}
Where is this breaking? Thanks in advance. Hi there, Hopefully someone will be able to help me here. I found the below script that works fine for the actual countdown, but when the user refreshes the page, the countdown starts from 5 minutes again. What I am trying to do, is handle users that put something in their shopping cart and then get side tracked or what ever reason and that same product then being purchased by another person when I only have 1 left. So using PHP I am going to subtract the qty of that product by 1 and then I want the website to either put it back, if the users checkout times out, or if a normal process it is taken out permanently. So long story short I think I need some sort of 'memory' for the javascript, so the user can't just keep refreshing and it starting from 5 minutes each time. Also it needs to be carried through to other pages. Your help is greatly appreciated. Thanks, Simon. Code: <script type="text/javascript">
/* This script and many more are available free online at
The JavaScript Source :: http://javascript.internet.com
Created by: Neill Broderick :: http://www.bespoke-software-solutions.co.uk/downloads/downjs.php */
var mins
var secs;
function countdown() {
mins = 1 * CDm("5"); // change minutes here
secs = 0 + CDs(":01"); // change seconds here (always add an additional second to your total)
CDredo();
}
function CDm(obj) {
for(var i = 0; i < obj.length; i++) {
if(obj.substring(i, i + 1) == ":")
break;
}
return(obj.substring(0, i));
}
function CDs(obj) {
for(var i = 0; i < obj.length; i++) {
if(obj.substring(i, i + 1) == ":")
break;
}
return(obj.substring(i + 1, obj.length));
}
function CDdis(mins,secs) {
var disp;
if(mins <= 9) {
disp = " 0";
} else {
disp = " ";
}
disp += mins + ":";
if(secs <= 9) {
disp += "0" + secs;
} else {
disp += secs;
}
return(disp);
}
function CDredo() {
secs--;
if(secs == -1) {
secs = 59;
mins--;
}
document.getElementById("countdown").firstChild.nodeValue = CDdis(mins,secs);
//document.cd.disp.value = dis(mins,secs); // setup additional displays here.
if((mins == 0) && (secs == 0)) {
window.alert("Time is up. Press OK to continue."); // change timeout message as required
// window.location = "yourpage.htm" // redirects to specified page once timer ends and ok button is pressed
} else {
countdown = setTimeout("CDredo()",1000);
}
}
function coundowninit() {
countdown();
}
</script>
Code: <span id="countdown"> </span> //*Below is the code that i can't get to work. It's suppose to post a product string to internetsecure's gateway. I was successful in building one version of this here is the link below. if you want to take a look at one that works you can view the source from the link below. I'm extremely new with JavaScripting. https://testwww.internetsecure.com/m....asp?page=SAM5 If you want to try it out copy the code into a file and save it as ticket.html*// <script type="text/javascript"> function ChangeProducts(amountIn) { var quantity = parseInt(document.gotoIS.txtQuantity.value); var unitPrice, totalPrice if(description = "General Tickets") unitPrice = 60.32; else if(description = "Senior Tickets") unitPrice = 54.82; else if(description = "Groups 8 General Tickets") unitPrice = 54.82; else if(description = "VIP Tickets") unitPrice = 93.22; else if(description = "Group 8 VIP Tickets") unitPrice = 87.74; else unitPrice = 60.32; document.gotoIS.txtUnitPrice.value = unitPrice.toFixed(2); document.gotoIS.txtTotalPrice.value = totalPrice.toFixed(2); document.gotoIS.txtDescription.value = description; // Create Advanced Product string for InternetSecure Processor// document.gotoIS.Products.value = ""+ unitPrice +"::"+ quantity +"::SHOW1::"+ description +"::{TEST}"; } </script> <html> <head> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body> <FORM NAME="gotoIS" METHOD="POST" action ="https://test.internetsecure.com/process.cgi" onSubmit="ChangeProducts()"> <FONT COLOR="00007f">Select ticket type</FONT><br> <input type="hidden" name="GatewayID" VALUE="106" /> <input type="hidden" value="English" name="language" /> <input type="hidden" value="https://testwww.internetsecure.com/merchants/Demopage.asp?page=THNK" name="ReturnURL"> <input type="hidden" value="https://testwww.internetsecure.com/merchants/Demopage.asp?page=SAM1" name="xxxCancelURL"> <font color="red">*</font>Select Ticket to Order: <select name="txtDescription"> <option value="General Tickets">$60.32 USD - General Tickets $55.00 each plus tax.</option> <option value="Senior Tickets">$54.82 USD - Senior Citizen Discount over 55 $50.00 each plus tax.</option> <option value="Groups 8 General Tickets">$54.82 USD - Groups of 8 or more $50.00 each plus tax.</option> <option value="VIP Tickets">$93.22 USD - VIP Tickets $85.00 each plus tax.</option> <option value="Group 8 VIP Tickets">$87.74 USD - VIP Tickets with groups of 8 or more $80.00 each plus tax.</option> </select> Quantity of tickets: <input type="text" name="txtQuantity" maxlength="2" sixe="2" value=""><br> <br> <input type="hidden" name="txtUnitPrice" value=""> <input type="hidden" name="Products" value=""> <input type="Submit" Value="Submit Donation"> </FORM> Ok, for starters I'm not a beginner and my website is running under standards mode (not quirks). When my site loads I perform: Code: window.location.replace(window.location.href + "#encodedstuff"); The effect being that no new history points are created and the very first history point now includes some encoded info in the hash. When the user closes and relaunches IE8 and then chooses "reopen last browsing session" I expect IE to make the request for the page including the hash value. It does NOT! It simply makes the request for the URL without the hash (and then adds the hash as the next history point). I need help figuring out why and if there is a way to accomplish this without needing to add a parameter to the location get request (which will cause my site to reload upon launch if this parameter is not already set... I don't want it doing that). Please note that the browser DOES behave if I copy the new URL, including the hash value and paste it into a new tab (closing the old tab). When I relaunch IE8 and reopen the previous session it does make the request with hash value and my site is able to get the required info out of the hash. It only fails for a tab that initially did not have a hash and my script performs the above location.replace. Solving this is critical for my application, so I seriously appreciate any help! Hello, I am trying to create multiple google maps with multiple directions that load on one page. I have tried duplicating the var and function names but I haven't been able to get it to work. Does anyone have any ideas? Any help or suggestions would be greatly appreciated! -Topianno Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google Maps JavaScript API Example: Advanced Directions</title>
<script src=" http://maps.google.com/?file=api&v=2.x&key=ABQIAAAAzr2EBOXUKnm_jVnk0OJI7xSosDVG8KKPE1-m51RBrvYughuyMxQ-i1QfUnH94QxWIa6N4U6MouMmBA"
type="text/javascript"></script>
<style type="text/css">
body {
font-family: Verdana, Arial, sans serif;
font-size: 11px;
margin: 2px;
}
table.directions th {
background-color:#EEEEEE;
}
img {
color: #000000;
}
</style>
<script type="text/javascript">
var map;
var map2;
var gdir;
var gdir2;
var geocoder = null;
var geocoder2 = null;
var addressMarker;
var addressMarker2;
function initialize() {
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("map_canvas"));
gdir = new GDirections(map, document.getElementById("directions"));
GEvent.addListener(gdir, "load", onGDirectionsLoad);
GEvent.addListener(gdir, "error", handleErrors);
setDirections("San Francisco", "Mountain View", "en_US");
setDirections2("San Francisco", "Mountain View", "en_US");
}
}
function setDirections(fromAddress, toAddress, locale) {
gdir.load("from: " + fromAddress + " to: " + toAddress,
{ "locale": locale });
}
function handleErrors(){
if (gdir.getStatus().code == G_GEO_UNKNOWN_ADDRESS)
alert("No corresponding geographic location could be found for one of the specified addresses. This may be due to the fact that the address is relatively new, or it may be incorrect.\nError code: " + gdir.getStatus().code);
else if (gdir.getStatus().code == G_GEO_SERVER_ERROR)
alert("A geocoding or directions request could not be successfully processed, yet the exact reason for the failure is not known.\n Error code: " + gdir.getStatus().code);
else if (gdir.getStatus().code == G_GEO_MISSING_QUERY)
alert("The HTTP q parameter was either missing or had no value. For geocoder requests, this means that an empty address was specified as input. For directions requests, this means that no query was specified in the input.\n Error code: " + gdir.getStatus().code);
// else if (gdir.getStatus().code == G_UNAVAILABLE_ADDRESS) <--- Doc bug... this is either not defined, or Doc is wrong
// alert("The geocode for the given address or the route for the given directions query cannot be returned due to legal or contractual reasons.\n Error code: " + gdir.getStatus().code);
else if (gdir.getStatus().code == G_GEO_BAD_KEY)
alert("The given key is either invalid or does not match the domain for which it was given. \n Error code: " + gdir.getStatus().code);
else if (gdir.getStatus().code == G_GEO_BAD_REQUEST)
alert("A directions request could not be successfully parsed.\n Error code: " + gdir.getStatus().code);
else alert("An unknown error occurred.");
}
function onGDirectionsLoad(){
// Use this function to access information about the latest load()
// results.
// e.g.
// document.getElementById("getStatus").innerHTML = gdir.getStatus().code;
// and yada yada yada...
}
</script>
</head>
<body onload="initialize()" onunload="GUnload()">
<h2>Maps API Directions Illustrated</h2>
<form action="#" onsubmit="setDirections(this.from.value, this.to.value, this.locale.value); return false">
<table>
<tr><th align="right">From: </th>
<td><input type="text" size="25" id="fromAddress" name="from"
value="San Francisco"/></td>
<th align="right"> To: </th>
<td align="right"><input type="text" size="25" id="toAddress" name="to"
value="Mountain View" /></td></tr>
<tr><th>Language: </th>
<td colspan="3"><select id="locale" name="locale">
<option value="en" selected>English</option>
<option value="fr">French</option>
<option value="de">German</option>
<option value="ja">Japanese</option>
<option value="es">Spanish</option>
</select>
<input name="submit" type="submit" value="Get Directions!" />
</td></tr>
</table>
</form>
<br/>
<table class="directions">
<tr><th>Formatted Directions</th><th>Map</th></tr>
<tr>
<td valign="top"><div id="directions" style="width: 275px"></div></td>
<td valign="top"><div id="map_canvas" style="width: 310px; height: 400px"></div></td>
</tr>
</table>
<h2>Maps API Directions Illustrated 2nd Map</h2>
<form action="#" onsubmit="setDirections2(this.from.value, this.to.value, this.locale.value); return false">
<table>
<tr><th align="right">From: </th>
<td><input type="text" size="25" id="fromAddress2" name="from"
value="San Francisco"/></td>
<th align="right"> To: </th>
<td align="right"><input type="text" size="25" id="toAddress2" name="to"
value="Mountain View" /></td></tr>
<tr><th>Language: </th>
<td colspan="3"><select id="locale" name="locale2">
<option value="en" selected>English</option>
<option value="fr">French</option>
<option value="de">German</option>
<option value="ja">Japanese</option>
<option value="es">Spanish</option>
</select>
<input name="submit" type="submit" value="Get Directions!" />
</td></tr>
</table>
</form>
<br/>
<table class="directions">
<tr><th>Formatted Directions</th><th>Map</th></tr>
<tr>
<td valign="top"><div id="directions" style="width: 275px"></div></td>
<td valign="top"><div id="map_canvas" style="width: 310px; height: 400px"></div></td>
</tr>
</table>
</body>
</html>
I'm working on creating a jQuery book online that utilizes .animate to create nifty effects. I'm nearly finished with the initial animation and design, but have run across a pretty irritating snag. Have a look at http://notebook.dauidusdesign.com to see the problem. The trouble: When you click on the right arrow or hover to see the next page, all works exactly right. But, when you hover on the left arrow, the animation occurs on the wrong side of the page... it should occur on the left side and show the page behind it. I'm pretty sure it comes down to something in the code below, as that is where the majority of hover animations occur. For a look at the rest of the code, visit the site above, view the source and check out the file jquery.booklet.1.1.0.js. The code below begins at line 401. Thanks for the help! Code: //add page hover animations
if(opts.hovers){
ctrlsN.hover(
function(){
if(!busy && opts.curr+2 <= opts.pTotal-2){
//animate
p2.stop().animate({right:5, 'width':opts.pWidth-140, 'height':opts.pHeight}, 800, opts.easing);
p2wrap.stop().animate({left:"-5px"}, 800, opts.easing);
p3.stop().animate({'left':opts.width-180, 'width':30, paddingLeft: 50}, 800, opts.easing);
p3wrap.stop().animate({left:10}, 800, opts.easing);
rhover = true;
}
},
function(){
if(!busy && opts.curr+2 <= opts.pTotal-2){
p2.stop().animate({right:0, 'width':opts.pWidth, 'height':opts.pHeight}, 800, opts.easing);
p2wrap.stop().animate({left:0}, 800, opts.easing);
p3.stop().animate({'left':opts.width, 'width':0, paddingLeft: 0}, 800, opts.easing);
p3wrap.stop().animate({left:0}, 800, opts.easing);
rhover = false;
}
}
);
ctrlsP.hover(
function(){
if(!busy && opts.curr-2 >= 0){
//animate
p1.stop().animate({left:5, 'width':opts.pWidth-140}, 800, opts.easing);
p1wrap.stop().animate({right:"-5px", 'right':opts.pWidthH-140}, 800, opts.easing);
p0.stop().animate({'right':opts.width-180, left:100, 'width':80}, 800, opts.easing);
p0wrap.stop().animate({right:10}, 800, opts.easing);
lhover = true;
}
},
function(){
if(!busy && opts.curr-2 >= 0){
p1.stop().animate({left:0, 'width':opts.pWidth}, 800, opts.easing);
p1wrap.stop().animate({right:0, 'right':opts.pWidthH}, 800, opts.easing);
p0.stop().animate({'right':opts.width-0, left:0, 'width':0}, 800, opts.easing);
p0wrap.stop().animate({right:0}, 800, opts.easing);
lhover = false;
}
}
);
}
Hello I am building a registration page . If the user completes all the required field i load the info into the database but if there are missing fields I combined some javascript into php to display next to the empty field a note that it should be filled. This is my code : Code: <?php
if (isset($_POST['submit']))
{
$username =$_POST['username'];
$password =$_POST['password'];
$password2 =$_POST['password2'];
$firstname =$_POST['firstname'];
$lastname =$_POST['lastname'];
$email =$_POST['email'];
$address =$_POST['address'];
$city =$_POST['city'];
$state =$_POST['state'];
$zip =$_POST['zip'];
$dob =$_POST['dob'];
if (empty($username)){
?> <script language="javascript">
var user =true
</script> ;<?
}
if (empty($password)){
?> <script language="javascript">
var pass =true
</script><? ;
}
And it goes on................... Then next to the inpput box I display a text in case the user didn't fill in the info like this and by the way the above code is in my validate.php page wich i include in the main registration page Code: <?php include ('includes/validate.php');?>
<form action="registration.php" method= "post" >
<fieldset>
<legend>sitename Registration</legend>
<p>
<label for"username">Username</label>
<input type "text" name=username /> <script type="text/javascript">
if (user == true)
{
document.write("Please enter a Username of your choice");
}
</script>
</p>
<p>
<label for"password">Password</label>
<input type "password" name=password /> <script type="text/javascript">
if (pass == true)
{
document.write("Please choose a Password");
}
</script>
</p>
<p>
<label for"password2">Re-type Password</label>
<input type "pass2" name=password2 /> <script type="text/javascript">
if (pass2 == true)
{
document.write("Please re-type your Password");
}
</script>
</p>
And it goes on......for the rest of the input fields. I need some help with a solution for when the user fills in the info and pushes the "register" button the page refreshes and it whipes all the info the user already input but it does display the warnings where the user didn't input any data, so what would be the best way to go to keep the data that the user entered.Thank you. I am in need of some help. I have a request from a client to have four text fields added together as soon as they input the number. They want the numbers to add together with out having to hit a submit button or have the page change. I have seen and been able to get two out of the four to add together but i can't get the rest. I am pretty new to JS so please be gentle. But any help is greatly appreciated. this is the code i have been trying to work with: [CODE] function calc(A,B,SUM) { var one = Number(A); if (isNaN(one)) { alert('Invalid entry: '+A); one=0; } var two = Number(document.getElementById(B).value); if (isNaN(two)) { alert('Invalid entry: '+B); two=0; } document.getElementById(SUM).value = one + two; } <input name="sum1" id="op1" value="" onChange="calc(this.value,'op2','result')" /> and another number: <input name="sum2" value="" id="op2" onChange="calc(this.value,'op1','result')" /> Their sum is: <input name="sum" value="" id="result" readonly style="border:0px;"> [CODE] Hi all, I'm new to here and JS but I have question for you! So I have this form with inputs that are considered arrays in my PHP code: Code: <input type="checkbox" name="1" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="2" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="3" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="4" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="5" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="6" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="7" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="8" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="9" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="10" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="11" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="12" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="13" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="14" /> <input name="ii[]" type="text"> <br /> <input type="checkbox" name="15" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="16" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="17" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="18" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="19" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="20" /> <input name="i[]" type="text"> <br /> I don't want to keep adding in new spots every time a user want to add a new field. I would like them to be able to press a button that will add another one of those fields and so on. I'm not sure how this can be achieved but that's why I am turning to you! Thanks! Hi, i have this code that generate 10 rows with form fields: Code: <form>
<?php for($i=1;$i<=10;$i++) {?>
<div id="rowz-rep">
<div class="row1"><?=$i?></div>
<div class="row2a"><input name="title[]" type="text" class="fieldSubmit"/></div>
<div class="row3a"><input name="url[]" type="text" class="fieldSubmit"/></div>
<div class="row4a"><select name="type[]" class="dropSubmit"><? foreach($allowed_types as $at) { echo '<option value="'.$at.'">'.$at.'</option>'; }?></select></div>
</div>
<? }?>
</form>
I need that onclick with JS add 10 more rows so i get something like Code: <?php for($i=1;$i<=20;$i++) {?>
|
|||||||