|
JavaScript - How Does This On Submit Work?
OK! I re adjusted some things after some research. Still a bit confused:
Code:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>login</title>
<script type="text/javascript">
function encode64(form) {
var username=un;
var password=pass;
var ip=ip;
var enKey= 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/';
var deKey = new Array(
-1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1,
-1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1,
-1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, 62, -1, -1, -1, 63,
52, 53, 54, 55, 56, 57, 58, 59, 60, 61, -1, -1, -1, -1, -1, -1,
-1, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14,
15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, -1, -1, -1, -1, -1,
-1, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37, 38, 39, 40,
41, 42, 43, 44, 45, 46, 47, 48, 49, 50, 51, -1, -1, -1, -1, -1
);
var str=new Array();
var ch1, ch2, ch3;
var pos=0;
while(pos+3<=src.length){
ch1=src.charCodeAt(pos++);
ch2=src.charCodeAt(pos++);
ch3=src.charCodeAt(pos++);
str.push(this.enKey.charAt(ch1>>2), this.enKey.charAt(((ch1<<4)+(ch2>>4))&0x3f));
str.push(this.enKey.charAt(((ch2<<2)+(ch3>>6))&0x3f), this.enKey.charAt(ch3&0x3f));
}
if(pos<src.length){
ch1=src.charCodeAt(pos++);
str.push(this.enKey.charAt(ch1>>2));
if(pos<src.length){
ch2=src.charCodeAt(pos);
str.push(this.enKey.charAt(((ch1<<4)+(ch2>>4))&0x3f));
str.push(this.enKey.charAt(ch2<<2&0x3f), '=');
}else{
str.push(this.enKey.charAt(ch1<<4&0x3f), '==');
}
}
return str.join('');
}
var encusername = encode64 (un);
var encpass = encode64 (pass);
//script andy gave me
function checkUrlRandom(url){
var mathRnd = Math.round(Math.random()*10000);
if(url.indexOf("?") > 0 ){
url = url + "&rnd=" + mathRnd;
}else{
url = url + "?rnd=" + mathRnd;
}
return url;
}
//HOW DO I GET THE ENCODED USERNAME AND PASSWORD AND NON ENCODED IP ADDRESS TO POST INTO THE URL UNDENEATH THIS AND THEN GO TO THAT URL?
xhr = new XMLHttpRequest();
xhr.open("GET",checkUrlRandom("http://"+ip+"/User.cgi?cmd=get_login&username="+encuseranme+"&password="+encpass+""));
</script>
</head>
<body>
<form name="form" method="get" onclick="encode64(this.form)">
<p>
<label for="ip">ip</label>
<input type="text" name="ip" id="ip" />
</p>
<p>
<label for="username">username</label>
<input type="text" name="username" id="username" />
</p>
<p>
<label for="password">password</label>
<input type="text" name="password" id="password" />
</p>
<p>
<input type="submit" name="submit" id="submit" value="click" />
</p>
</form>
</body>
</html>
HOW DO I GET THE ENCODED USERNAME AND PASSWORD AND NON ENCODED IP ADDRESS TO POST INTO THE URL AND THEN GO TO THAT URL? thanks -Mike Similar TutorialsHello There, I have form which submitted data by checkbox checked, the checkbox as looks: PHP Code: <input type="checkbox" name="agree" value="1" checked="checked" onclick="document.getElementById('parentTable').className,processForm() = this.checked ? 'vehicleOn' : 'vehicleOff'" /><label for="agree">Agree</label> and the Ajax as following Code: function processForm() {
$.ajax({
type: 'POST',
url: '<?php echo $send; ?>',
data: 'opt1=' + encodeURIComponent($('input[name=\'opt1\']:checked').val() ? $('input[name=\'opt1\']:checked').val() : '') + '&opt2=' + encodeURIComponent($('input[name=\'opt2\']:checked').val() ? $('input[name=\'opt2\']:checked').val() : '') + '&comment=' + encodeURIComponent($('textarea=[name=\'comment\']').val()) + '&agree=' + encodeURIComponent($('input[name=\'agree\']:checked').val() ? $('input[name=\'agree\']:checked').val() : ''),
beforeSend: function() {
$('.success, .warning').remove();
$('#confirm_button').attr('disabled', 'disabled');
$('#confirm_title').after('<div class="wait"><img src="mage/loading_1.gif" alt="" /> <?php echo $text_wait; ?></div>');
},
complete: function() {
$('#confirm_button').attr('disabled', '');
$('.wait').remove();
},
success: function(data) {
if (data.error) {
$('#confirm_title').after('<div class="warning">' + data.error + '</div>');
}
if (data.success) {
$('#confirm_title').after('<div class="success">' + data.success + '</div>');
$('input[name=\'opt1\']:checked').attr('checked', '');
$('input[name=\'opt2\']:checked').attr('checked', '');
$('input[name=\'agree\']:checked').attr('checked', '');
}
}
});
}
The Problem is won't work with IE only, I tested it with IE 6, Anyone could suggest me what I could do? any pointers, samples or links I would be appreciate and Thanks a lot. Whenever I click the Submit button, which should create a new window showing all the details entered in the form, it doesn't work ideas? javascript.html Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>JavaScript</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-15">
<!-- The external style sheets -->
<link rel="stylesheet" type="text/css" href="mystyle.css">
<script type="text/javascript" src="myjavascript.js"></script>
<meta name="keywords" content="CO332">
<meta name="description" content="CO332 Exercise Website">
<meta name="author" content="Bradley Berwick">
</head>
<body>
<div id="container">
<div id="maincontent">
<div id="header">
<h1>
Exercise Website
</h1>
</div>
<div id="leftnav">
<ul>
<li><a href="index.html" >Home</a>
<li><a href="myjavascript.html" ><span class="currentpage">Services</span></a>
<li><a href="#" >TBA</a>
<li><a href="#" >TBA</a>
</ul>
</div>
<div id="content">
<h2>About Yourself</h2>
<form name="exampleform">
<h3>Name: <input name="yourname" type="text"></h3>
<h3>Age: <input name="age" type="text" size="3"
Onchange = '
if ( !( this.value > 0 && this.value < 150 ) ) {
alert( this.value + " is not a valid age.");
this.value=""; // clear age text box
}' > </h3>
<h3>Gender:
<input name="gender" type="radio" value="male"> Male
<input name="gender" type="radio" value="female"> Female
</h3>
<h3>Your favourite colour:
<select name="colours">
<option value="None">
<option value="red">Red
<option value="green">Green
<option value="blue">Blue
<option value="pink">Pink
<option value="orange">Orange
<option value="purple">Purple
</select>
</h3>
<h3>Your hobbies a <br>
<input name="running" type="checkbox"> Running <br>
<input name="football" type="checkbox"> Football <br>
<input name="golf" type="checkbox"> Golf <br>
<input name="cycling" type="checkbox"> Cycling
</h3>
<textarea rows="10" cols="30">
Add comments.
</textarea>
<p>
<input type="reset" value="Clear">
<input name="submit" type="button" value="Submit"
onclick='submitForm()';>
</p>
</form>
</div>
</div>
<div id="footer">
<div id="mailto"> Last updated on 28th Oct 2011<br>
Maintained by Bradley Berwick
</div>
</div>
</div>
</body>
</html>
myjavascript.js Code: function displayMessage(msg) {
// Open a new window
var msgWindow = window.open('', 'Message');
// Write message in the new Window
msgWindow.document.write(msg);
msgWindow.document.close();
// Raise this window, in case it's not visible
msgWindow.focus();
}
var hobstring="";
function submitForm() {
var nam=document.exampleform.elements["yourname"].value;
var age=document.exampleform.elements["age"].value;
var gend = document.getElementsByName('gender');
for (var i = 0; i < gend.length; i++) {
if (gend[i].checked==true) {
var sex=gend[i].value;
}
}
var sel=document.getElementById('color');
var color=sel.options[sel.selectedIndex].value;
var hobbs = document.getElementsByName('hobby');
for (var a = 0; a < hobbs.length; a++) {
if (hobbs[a].checked==true) {
hobstring+=hobbs[a].id+", ";
}
}
var msg="Name: "+nam+"<br>Age: "+age+"<br>Gender: "+sex+"<br>Favorite color: "+color+"<br>Hobbies: "+hobstring;
displayMessage(msg);
}
the showUser function has ajax in it that calls a php file that accesses a db to perform some calculations. I wanted to use the clicked function to force required dropdowns to be selected but I cannot seem to get the submit button to do anything. It does nothing when you click it. Not sure how to proceed, have looked everywhere. If anyone has any advice I would really appreciate it. Code: <form id="forecastfilter" action="indexo_beats.php" method="get" onsubmit="clicked(this.value='yes')"> <div class="fc">Date:</div> <select name="date" onchange="showUser(this.value)"> <option value="">-- </option> <option value="Date: Past Hour">Past hour</option> <option value="Date: Past week">Past week</option> <option value="Date: Past month">Past month</option> <option value="Date: Past year">Past year</option> </select> <br /> <div class="fc">Wideouts:</div> <select name="wideouts" onchange="showUser(this.value)"> <option value="">-- </option> <option value="Wideouts: Higher">Revised Higher</option> <option value="Wideouts: Unchanged">Remains Unchanged</option> <option value="Wideouts: Lower">Revised Lower</option> </select> <br /> <div class="fc">QBs:</div> <select name="qbs" onchange="showUser(this.value)"> <option value="">-- </option> <option value="QBs: beat">Above Analyst Estimates</option> <option value="QBs: inline">Inline with Analyst Estimates</option> <option value="QBs: miss">Below Analyst Estimates</option> </select> <br /> <div class="fc">Football:</div> <select name="football" onchange="showUser(this.value)"> <option value="">-- </option> <option value="Football: beat">Above Analyst Estimates</option> <option value="Football: inline">Inline with Analyst Estimates</option> <option value="Football: miss">Below Analyst Estimates</option> </select> <br /> <div class="fc">Sentiment:</div> <select name="sentiment" onchange="showUser(this.value)"> <option value="">-- </option> <option value="Sentiment: good">Good</option> <option value="Sentiment: neutral">Neutral</option> <option value="Sentiment: bad">Bad</option> </select> <div class="searchbutton"> <input type="button" value="Search Draft" /> </div> </form> Hi, I have a jsp which has a function gets called during the page unload. This jsp has a form with an action attribute to one servlet. Please find below the code snippet. ---- Java script code --- function logoff() { document.forms["FormName"].rel="nofollow" target="_self"; alert('Submitting the form'); document.forms["FormName"].submit(); } --- HTML form code ----- <body onUnload='logOff()'> <form name ="FormName" method="POST" action='<%=sLogoutResponseURL %>'> Whenever the page gets unloaded always logoff function is getting called. I also get the alert message "Submitting the form". But my servrlet does not get invoked. My application supports logging in with the same user id more than once. Scenario it works: User logs in. Close the application. logoff function is called and servlet gets invoked. Scenario it does not work: User logs in one window. Open one more IE window and and open the application with same user id. this can be repeated. Now when i close the application logoff function is called for all of the window close. But servlet does not gets invoked all the time. Sometimes it stops calling servlet. I have searched over the net and found one solution. Below piece of code will make sure form gets always submitted. -------------------------Start ----------------- function fakeSubmit(event) { var target = event ? event.target : this; /* Fire a submit event */ var fakeEvent = $(target).fire("form:submit"); if (fakeEvent.stopped == false) { /* Call the real submit function */ this._submit(); } } if(window.HTMLElement){ /* DOM-compliant Browsers */ HTMLFormElement.prototype._submit = HTMLFormElement.prototype.submit; HTMLFormElement.prototype.submit = fakeSubmit; } else { /* IE does not expose it's HTMLElement object or its children Let the document load so all forms are accounted for */ document.observe("dom:loaded", function(){ for(var i = 0; i < document.forms.length; i ){ document.forms[i]._submit = document.forms[i].submit; document.forms[i].submit = fakeSubmit; } }); } -----------End ------------------ But this resulted in script error while loading the page "object does not support this method or property" at line where document.observe is there. Kindly help at the earliest. Thanks in advance Santosh this is my code ______________________________________________________________ <pega:when test="$mode-input"> <script language="JavaScript"> function showNextButton() { handleClientEvent('SERVER','MakeScoreOrder','','-1'); /* fetches the data */ var submitClicked = "<p:r n='pyWorkPage.PFRSData.SubmitClicked' />"; var submitClicked = submitClicked.replace(/^\s\s*/, '').replace(/\s\s*$/, ''); var msg = "<p:r n='pyWorkPage.PFRSData.HasMessages' />"; var msg = msg.replace(/^\s\s*/, '').replace(/\s\s*$/, ''); if (submitClicked == "" || msg =="true") { toggleSubmitBtn(0); } else if (submitClicked == "true" || msg =="false") { toggleSubmitBtn(1); } } function toggleSubmitBtn(status) { var submitButton=document.actionForm.submitButton; if(submitButton) { var parentTable=pega.u.d.findParentTable(submitButton); if(parentTable) if(status) { if(parentTable.style.display=='none' || parentTable.style.display=='') { parentTable.style.display='inline'; document.actionForm.submitButton.disabled=false; } } else { parentTable.style.display='none'; document.actionForm.submitButton.disabled=true; } } } </script> <button onClick="showNextButton();" id="PISSubmit" style="vertical-align:middle;"> <span class='buttonLeft'></span> <span class='buttonMiddle'> <span class='buttonText' onmouseover="this.className='buttonTextHover'" onmouseout="this.className='buttonText'">Submit</span> </span> <span class='buttonRight'></span> </button> </pega:when> ___________________________________________________________ On clicking PISsubmit button it should fetch data and display the next button(submitButton).. but on first click nothing happens on second click it fetches the data and third click it displays Next(submitButton)button. Kindly help !! Note: its in pega application. Hi, I have a form that when you click submit gives a warning box asking if to continue code below Now when I type in the text field and press enter it doesn't submit nor does it pop up the warning box, how would I do this Code for submit button Code: <script LANGUAGE="JavaScript">
<!--
function submitMyForm()
{
var agree=confirm("ARE YOU SURE ?");
if (agree)
return true ;
else
return false ;
}
// -->
</script>
Code: <form action="admin-delete.php" method="post" name="cp_delete" id="cp_delete"> <input type="text" name="cp_delete_bg" id="cp_delete_bg"> <input type="submit" name="submit" value="submit" onclick="return submitMyForm()"/> </form> Hi all Is using the real form submit button a problem in any way? Can it actaully send a form when a person uses 'enter' in a text field. When I use this submit, it triggers my validation which is great. Code: <input type="submit" value="OnSubmit validate" /> However this way doesn't seem to trigger my validation although It may solve the above form send problem (if that realy exists). How do I get it to act the same as real submit so it will trigger validation like onsubmit above? Code: <input type="button" value="Send Feedback" onclick="this.form.submit()" /> LT does any of that make sense? all ideas helpful and appreciated I have created some online software which uses form data to submit to another page. The problem is that I have other submit buttons in the same form which submit to different pages (depending on which button is pressed). The first submit button works fine but all the others only work once. Code: <input class="cssbutton" type='submit' value='Button1' onclick="wbform.action='page1.php'; target='mainFrame'; return true;"> <input class="cssbutton" type='submit' value='Button2' onclick="wbform.action='page2.php'; target='_blank'; return true;"> <input class="cssbutton" type='submit' value='Button3' onclick="wbform.action='page3.php'; target='topFrame'; return true;"> <input class="cssbutton" type='submit' value='Button4' onclick="wbform.action='page4.php'; target='topFrame'; return true;"> <input class="cssbutton" type='submit' value='Button5' onclick="wbform.action='page5.php'; target='_blank'; return true;"> <input class="cssbutton" type='submit' value='Button6' onclick="wbform.action='page6.php'; target='_blank'; return true;"> Any ideas my friends? I've got the following 2 fields in my form: <input type="file" name="filename" id="filename" value="filename"> <input type="submit" name="submit" value="Upload Image" /> Now I want to hide both of them as soon as the submit button is pressed. Problem is that I'm a javascript noob and I can't find it with google :S Can someone help me? I am trying to auto submit a login form remotely using .submit() . It's submitting, but for some reason if I use submit() the login isn't processing. However, if I turn off the auto submit and use an actual submit button it logs in just fine. Now, in the form tag there is a call onsubmit for some validation, does .submit() trigger that form onsubmit="" function? Is there something that happens differently when a user clicks a button verses the .submit(). Thanks! Paul Hi all, I'm designing something to addon to an existing product. I'm struggling with some javascript problems. I want to submit a hidden field when you click on an image button, rather than it being an actual submit button. It's going to submit the value "1" to a PHP page, but I don't want it to actually have to GO to the PHP page, just submit it within the webpage. Is this possible? Thanks Hello all, I made a fade script that will fade any element in or out. Works great on all browser I've tested but IE 7. With IE I have only tested this will IE 8 and IE 7. IE 7 the effect doesn't work. No error message or anything. I'm unsure what to do from here. I was hoping I could find some help here. Code: function fade(obj, duration, toggle) {
steps = 1000;
elem = document.getElementById(obj);
function fadeIn() {
for(var i = 0; i <= 1; i+=(1/steps)) {
setTimeout("elem.style.opacity = "+ i +"", i * duration);
setTimeout("elem.style.filter='alpha(opacity="+ i * 102 +")'", i * duration);
}
}
function fadeOut() {
for(var i = 0; i <= 1; i+=(1/steps)) {
setTimeout("elem.style.opacity = "+ (1-i) +"", i * duration);
setTimeout("elem.style.filter='alpha(opacity="+ (1-i) * 102 +")'", i * duration);
}
}
/* One for Fade in and anything will be fade out*/
if(toggle == 1) {
fadeIn();
}
else {
fadeOut();
}
}
Thanks, Jon W I have a basic understanding of Javascript, and I have posted here before. And my question is rather simple. I work for a company that moderates a virtual world. We have a mod tool but its kind of goofy. We have to edit a URL and then send the URL in a browser. It's a long and boring process. I am looking to have a basic form that puts all the required information together and submits it. What I can't figure out is how to submit a URL in javascript but not load it in a new window. This is a sample of what I currently use in another javascript used by the company: Code: theReport = replace(theReport,'\n','<br>');
var disp_setting="toolbar=no,location=no,directories=yes,menubar=yes,scrollbars=yes,width=480, height=640, left=400, top=0";
var docprint=window.open("","",disp_setting);
docprint.document.open();
docprint.document.write('<html><head><title>Report Generator</title>');
docprint.document.write('</head><body>');
docprint.document.write(theReport);
docprint.document.write('</body></html>');
docprint.document.close();
docprint.focus();
Hi, I want submit a form when highlight options select value = true. I did the following code, but it not works. Could someone help me to fix it? Quote: <script type="text/javascript" language="JavaScript"> if onfocus="url.select()" Return true; { document.form1.submit(); } </script> stickers Hi, I am executing a HTA file that submit the textarea contents to a database. I have the following add.asp page which needs one parameter querystr but my querystr is shown like a very long string value. When I submit it converts one in a long value and the query string is getting truncated after some characters. Can you please kindly share the code segment to workaround how to pass such a long string value to a asp page. This is how I invoke the test page: Quote: http://www.myfile.com/vider/add.asp However, now is shown in the address bar the contents of the textarea??? Quote: http://www.myfile.com/vider/add.asp?...ERVICES+ONLINE Could someone give me a bit help to solve this problem? Just he! Hi all, Im pretty new to HTML and Javascript so please bear with me if Im not explaining my problem well! I am building a website at work which has 2 frames, a main frame and a smaller frame at the side. In the smaller frame I have a text box and search button which will locate and open documents thats name match the text input. Everything seems to be working fine, however I have 3 problems.... 1) How do I complete the search by clicking enter instead of clicking the search button? 2) How do I get the text box to reset/clear after I have submitted a search? At present the entered text remains after I have completed the search 3) Can I get the text box to be selected and be ready for text input when I click on the frame that contains this? As it stands I have to click on the text box itself before I can enter text! Sorry for all the questions! As I said im pretty new to this and learning as I go along, so if you can point me in the right direction it will be greatly appreciated! Thanks Glen Hi! I have a page with 8 different <input type="select"> fields. All the time only one out from this 8 is shown. the rest of them are hidden with css: display:none; How can I submit with POST only the select that's showing, and not the rest? All of them have differnt names. Like dropdown1, dropdown2, and so on... I dont know how can I get the value out from the one that's shown, and not the rest. Please Help my brain is about to explode... hi i have a form where i need to join fields from the form prior to submission to flow into a pdf form. here is the function PHP Code: <SCRIPT language='javascript' type='text/javascript'> function joinna(form, elemName, ttl) { form.bname.value = form.b_fname.value + ' ' + form.b_lname.value; } </script> here is what the form input looks like PHP Code: <input class="left" onBlur="mark(this,'#ffffff','#000000')" name="b_fname" size="20" maxlength="40" onFocus="nextfield ='cb_fname'; mark(this,'#FFFF99','#0000FF')" value="<?php echo $row['b_fname'];?>" onChange="joinna(this.form,'b_fname','p1f6');"> </span> <input class="left" onBlur="mark(this,'#ffffff','#000000')" name="b_lname" size="20" maxlength="40" onFocus="nextfield ='cb_fname'; mark(this,'#FFFF99','#0000FF')" value="<?php echo $row['b_lname'];?>" onChange="joinna(this.form,'b_lname','p1f6');"> </span> and here is the calc field PHP Code: <input type="hidden" NAME="bname" value="" Size="7" onBlur="mark(this,'#ffffff','#000000')" onFocus="blur();document.smartform.bname.focus()" onChange="this.form.b_fname.value + this.form.b_lname.value; joinna(this.form,'field');" > this works fine IF i manually insert something new into the b_fname field. but lets say a user pulls the for to edit, and then makes no changes, "bname" will remain blank. what i want to do is call the function and/or force an 'onchange' or do whatever so bname is not left blank in the event the user submits w/o making any changes to the form tia |
|||||||