|
JavaScript - Submit Without Reload But Let Firefox Save The Input
Hello there,
I want to build a form which invokes an ajax-function and therefore the page shouldn't reload. The problem is I don't want to avoid the autocompletion of the browser. But to save the input i have to submit the form regularly, which means 'onSubmit="return false;"' doesn't work. Is there any possibility or is this technique just impossible? Thx for reading and thinking about it! This is the current code, which works fine, but the browser doesn't save the (non-)submitted input. (The submit will be invoked by the "getSuggests()"-function.) Code:
<form id="mytaste-selection" name="mytaste-selection" autocomplete="on" onSubmit="return false;">
<fieldset>
<legend>
Search
</legend>
<div style="padding: 0px 0px;">
<label class="standard">Artist:</label>
<input id="mytaste-artist" name="mytaste-artist" class="standard text" type="text" autocomplete="on"/>
<label class="standard">Title:</label>
<input id="mytaste-title" name="mytaste-title" class="standard text" type="text" autocomplete="on"/>
</div>
<div class="button" onclick="getSuggests(urlEncode(getElementById('mytaste-artist').value),urlEncode(getElementById('mytaste-title').value),(getElementById('top').checked)?'top':'similar');">
Search
</div>
<div>
<label class="standard">Top Tracks</label>
<input class="standard radio" name="method_type" id="top" type="radio" checked="checked"/>
<label class="standard" style="margin: 2px 2px 2px 20px;">Similar Tracks</label>
<input class="standard radio" name="method_type" id="similar" type="radio"/>
</div>
</fieldset>
</form>
PS: If anything isn't clear please inform, if you also think that this issue is tricky, just answer with "Tricky" PPS: you can have a look at the page at http://mytaste.alitility.com Similar TutorialsI need some help as this is driving me crazy. I have a onblur, focus with this code for the columns of footer filter. Code: $("tfoot input").keyup( function () {
/* Filter on the column (the index) of this element */
oTable.fnFilter( this.value, $("tfoot input").index(this) );
} );
$("tfoot input").each( function (i) {
asInitVals[i] = this.value;
} );
$("tfoot input").focus( function () {
if ( this.className == "search_init" )
{
this.className = "";
this.value = "";
}
} );
$("tfoot input").blur( function (i) {
if ( this.value == "" )
{
this.className = "search_init";
this.value = asInitVals[$("tfoot input").index(this)];
}
} );
I am clearing the input fields with this. Code: $("input:button").click(function(e) { $('#col1').val('');
$('#col2').val('');
$('#col3').val('');
$('#col4').val('');
$('#col5').val('');
Including a reset of the filters, but won't bore with that, it works, the filters for the columns are all released and reset. My issue is the tfoot fields are cleared just fine, but remain blank. The onblur values do not refill the fields until I click in, then click out of the input field. Do I need to adjust for the clearing of the input field in the original focus and onblur? Or do I need a better reset of the the .val('') statement with a tweak to let the onblur function to show. Thanks, any help really appreciated. Tom I need help using javascript cookies to save the input users will fill in to many inputs within one form. I've never worked with cookies and I was wondering if someone could help me out here - the answers I've found searching the web do not work for me. Any help is appreciated, Thanks. I've been searching for how to do this, what seems simple, task. I have a form with multiple inputs and I want to be able to save them onchange, using the html5 function localStorage. Does anybody have an idea how I could go about doing this? It seems simple but I'm not very familiar with coding. Any help is appreciated! Hi, I am a beginner to javascript , I wish to learn how to create a .txt in local machine and store the data input in the textarea with the current data & time updated too. I am wondering is it possible to do so ? Please provide me a website or tutorial that I can learn about this. I tried to search it over the net but I just can't find a suitable tutorial for beginners like me. Thanks for the help. I appreaciate a lot. If I have post this thread in a wrong section, please kindly move it to a correct section as I can't find the suitable section to ask about this. I have a very small script that simply displays a search box and redirects a user to a URL if they enter 29401 or 29455, else they go to a default page. The script works fine, but I cannot figure out how to make value="enter a zip code" in the input box so that it disappears when you click in the box. I also can't get the form to submit by pressing enter, you have to click "check". I can get all this working in straight HTML but the same won't work w/ javascript. Any help please? <SCRIPT LANGUAGE="JavaScript"> function zipValidate(){ val = document.zipForm.zip.value; switch(val){ case "29401": case "29455": document.location = 'http://www.gohere.com'; break; default: document.location = 'http://www.or-go-here.com'; break; } } </SCRIPT> <form name="zipForm" id="zipForm" method="post" action=""> <input name="zip" type="text" id="zip" maxlength="5" /> <input name="zipButton" type="button" id="zipButton" value="Check" onclick="zipValidate()" /> </form> Hi, i have an input value array for customer ids, i also need to make a copy of that array into another input element on submit to use for another process. So far here is what i have come up with regarding the js the current html is this Code:
<!-- original input -->
<input id="cb<?php echo $i;?>" name="cid[]" value="<?php echo $commissions[$i]['id'];?>" onclick="isChecked(this.checked);" type="checkbox" />
<!-- this is new html input which is outside the $i loop that i need a copy of cid[] stored on submit
<input type="hidden" name="ids[]" onsubmit="valueTovalue();" />
<!-- here is the js so far -->
<script type="text/javascript">
function valueTovalue()
{
var valin = document.adminForm.cid.value; //cid is the array cid[]
document.adminForm.ids.value = valin; //copy the array to the new input element array ids
}
</script>
so basically if they click 1 cid then ids will also show 1, if they click all cid then ids will show all as well. will that work the way i have it, am i even close here.. thanks update: what i have seems to work fine for text values or string values but not for arrays, what am i missing that it wont copy an array? Array ( [cid] => Array ( [0] => 1 ) [task] => remarksonly [remark] => hhhyyy [boxchecked] => 1 [ids] => Array ( [0] => ) ) am i getting closer lol Code:
function valueTovalue()
{
var valin = cid.concat;
document.adminForm.ids.value = valin.concat;
return(true);
this has to be close i hope Code: document.adminForm.ids.value = [].concat(document.adminForm.cid); Below is a script I found at http://bytes.com/topic/javascript/an...cookie-problem The idea is a like button, like on fb, in a form which updates a db field I can use to display the number of likes, and my goal is to disable the like button for the rest of the session, or a day, or whatever. This script disables it onclick, the problem is I can't figure out how to get it to submit the form as well. I have found it does submit if the input type is 'submit', but then it doesn't call the disable function. I tried writing another function to submit the form but no go. Code: <html>
<head>
<title>Vote Button</title>
<script type="text/javascript">
function checkForVote()
{
// If there is a cookie...
if(document.cookie != "")
{
if(getCookie("voted") == 1)
{
// Disable the button again if user already voted.
disableButton();
}
}
}
function disableButton()
{
var submitvote = document.getElementById("submitvote");
submitvote.disabled = true;
submitvote.value = "You Already Voted.";
}
function setCookie(name, value, days)
{
if(days)
{
var date = new Date();
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
var expires = "; expires = " + date.toGMTString();
}
else
{
var expires = "";
}
document.cookie = name + "=" + value + expires + "; path=/";
// Disable the button as soon as the user clicks it.
disableButton();
}
function getCookie(name)
{
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i=0; i < ca.length; i++)
{
var c = ca[i];
while (c.charAt(0)==' ')
{
c = c.substring(1,c.length);
}
if (c.indexOf(nameEQ) == 0)
{
return c.substring(nameEQ.length,c.length);
}
}
return null;
}
</script>
</head>
<body>
<form name="voteform" id="voteform" action="foo.php" method="post">
<input type="button" name="submitvote" id="submitvote" onclick="setCookie('voted', 1, -1);" value="Submit Vote"/>
</form>
</body>
<script type="text/javascript">
// Run checkForVote() at end of document so that form and contents can be referenced
window.onload = checkForVote();
</script>
</html>
This is probable very easy, I've tried with normal html and am unable to get my head around it. I would like to in some way replicate how a web browser works. I have a form entry field with a submit button at the top of the page. Under that I have an iframe. I copy the url http://www.bbc.co.uk into the entry field, click submit and the iframe updates with the website. Have looked around and haven't found anything similar. Code so far.... <form target="myURL"> <input type="text" name="goTo"> <input type="submit" name="submit" value="submit"> </form> <iframe src="" name="myURL" border="0" frameborder="0" width="768" height="354"></iframe> Thanks in advanced. Death = $Mill It seems like it should be simple, but I don't see what I'm missing. Right now, the search button displays directly under my input field. I've gone through the CSS, but can't figure out where my code is forcing the button onto its own line. What am I missing? How can I bring it up to the same line?? Code: <form role="search" method="get" id="searchform" action="http://www.centerpie.com/" > <div> <input type="text" value="" maxlength="100" name="s" id="s"><input type="submit" id="searchsubmit" value="Search"> </div> </form> Hate to ask this as I know it's an easy one but surprisingly Google turns up no clear/simple answers! I'm modifying some old code and am not JS programmer (I'm a PHP programmer) and this is driving me nuts. The existing code makes sure that when the form is submitted that there isn't a missing value. There's also some hidden input values. The JS starts out function checkform(orderform) and the form tag includes onsubmit="return checkform(this);"> I can add an alert to the form to see varius input values, such as a hidden value for the input name 'description' I can use: alert (orderform.description.value) Eazy peazy. However the form has two different input type=image buttons now and I need to do some branching in the JS depending on which image button they press. I recall IE had an issue where it only sends the x and y coordinates So I figure an easy to determine which image button was pressed is just check to see if the x or y value for each button is non-zero. But I can't for the life of me figure out how to access the value. Example: alert (orderform.button1.x.value) doesn't work. Can someone refresh my memory or suggest an entirely different method for detecting which image button was used to submit a form? THanks in advance! New to this. This code works in IE but does not work in firefox. It just stays on the same page and does nothing. Please Help! Code: <table>
<CFFORM action="mypage.cfm METHOD="post" name="Login" rel="nofollow" target="_blank" id="go">
<cfinput type="hidden" name="decrypted" value="#decrypted#">
<tr>
<td>
<a class="K" HREF="javascript:document.go.submit();">My Page</a>
</td>
</tr>
<tr>
<td >
<table>
<tr>
<td>
<a HREF="javascript:document.go.submit();"><img border="0" src="images/icon.PNG" align="left" /></a>
</td>
</tr>
</table>
</td>
</tr>
</CFFORM>
</table>
What needs to be done to have the below input (red) passed to the forms action (blue) when the submit button is pressed. Obviously this should be the user input value and not the default 0.00 one. Ty. echo ' <center> <form method="post" action="https://www.paymate.com/PayMate/ExpressPayment?mid=MoreBloodWine&popup=false&ref=EoJ Market Place Donation¤cy=USD&amt= 1.23 &amt_editable=N&return=http://www.eojmarket.com"> Donation Amount: $<input style="vertical-align: middle; color: #FFFFFF; background-color: transparent; border: 1px solid; border-color: #9E853D; padding: 0px 0px 0px 1px; font-size: 10px; width: 50px;" name="amount" type="text" maxlength="6" value=" 0.00 "> <br /> <input type="image" style="padding-top: 10px; padding-bottom: 10px; border: none;" src="http://www.eojmarket.com/NonForumStuff/images/paymate-donate-button.png" value="Submit" alt="Pay with Paymate Express !"/> </form> </center> '; well title says it all i have a search form, and the default value is "enter text here" when the user click the submit button, i would like to check if the value of my text input is "enter text here" and if it is, then don't submit the form (popup a warning or something) how can i do that? thanks a lot! 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> This is my dilemma and I am not sure if I am handling the right way, so please suggest a new way or provide a valid answer so that I may achieve my goal. Thanks in advance for your help in solving this matter. In short I have a single "A.html" page that uses AJAX to reload in "B.php" into a <DIV id='bDiv'> every second and "C.php" into another <DIV id='cDiv'> with no reloading. The code in B.php generates a random number between 1 and 100. If the number generated is less than 10, I want <DIV id='cDiv'> to refresh its content. I have tried a number of tricks, I could not find anything in jQuery so if there is please point me to the correct function calls. hello im working on my senior design project for my electrical engineering class. and part of the project is to upload an image via php (which ive written and it works great) but when the image is loaded into the same directory as the html file (which is supposed to display the image everytime a new image is uploaded) the image stays the same it doesnt show the new image. but i kno the new image has been uploaded because i can see it my web server. this is the code Code: <html>
<head>
<title>Human Cam</title>
<script type = "text/javascript">
function refresh() {
var refreshTime = 5*1000; //5000ms
var thisImage = "Lighthouse.jpg"; //the image location
var today = new Date(); //the current time
//add the time to the end of the image string
//to make a unique url:
document.images["pic"].src=thisImage+"?"+today;
//reload if the images are loaded:
if (document.images) {
window.onload=refresh;
}
//IF the time is up reload the image
t=setTimeout('refresh()', refreshTime);
}
</script>
</head>
<body onload="refresh()">
<center>
<h2>human cam</h2>
<img src="Lighthouse.jpg" id="pic">
</center>
</body>
</html>
I have a index page on which there are several iframes which point to pages from a tomcat server. Sometimes when the index page loads, most of the iframes display session expired error. When I refresh the page, all iframes load properly. I want to reload the page twice whenever I come to that page initially. I also want to reload that page twice when I come to it from another page. Any ideas are welcome. I have tried the following in the onload event ----------------- if(window.location.search.indexOf('reload')<0) window.location.replace(window.location.href+'?reload'); --------------- function loaded() { if (!navigator.fudge) { navigator.fudge = 0; } navigator.fuge++; if (navigator.fudge>1){navigator.fudge=0} else{location.reload()}; } ------------- if(readCookie('reloaded')!='Yes') { createCookie('reloaded','Yes',1); window.location.reload(); } else eraseCookie('reloaded'); function createCookie(name,value,days) { if (days) { var date = new Date(); date.setTime(date.getTime()+(days*24*60*60*1000)); var expires = "; expires="+date.toGMTString(); } else var expires = ""; document.cookie = name+"="+value+expires+"; path=/"; } function readCookie(name) { var nameEQ = name + "="; var ca = document.cookie.split(';'); for(var i=0;i < ca.length;i++) { var c = ca[i]; while (c.charAt(0)==' ') c = c.substring(1,c.length); if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length); } return null; } function eraseCookie(name) { createCookie(name,"",-1); } --------------------------- several meta tags to get the page each time from the server e.x. <META HTTP-EQUIV="Pragma" CONTENT="no-cache"> <META HTTP-EQUIV="Expires" CONTENT="-1"> 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'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 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? |
|||||||