JavaScript - Executing Popup Instead Of Form Action
I have three buttons on my form. The user has to be logged in for the buttons to do anything. Is it possible to get an alert to popup on the form page without the form action occuring? If so, how do I go about it?
Similar TutorialsHi, I'm trying to make a form that when you click "submit", the original page goes somewhere, and it also creates a popup for the action URL. Currently, I can get the popup portion, but the can't get the original window to redirect somewhere else. this is what I have in the head. Code: <SCRIPT TYPE="text/javascript"> <!-- function popupform(myform, windowname) { if (! window.focus) return true; window.open('', windowname, 'height=200,width=400,scrollbars=no'); myform.target=windowname; return true; } //--> </SCRIPT> And this is what I have in the body Code: <form id="update" action="update.php" method="POST" name="update" onSubmit="popupform(this, 'join')"> So I have a little calendar widget on my site, for people to choose their dates for a reservation system. They then click a 'Book Now' button which creates a dynamic url (using their start date and the number of dates) to the booking engine. The problem is, the way it accomplishes this (window.location.href=), breaks cross-domain tracking on Google Analytics. And I'm not smart enough to figure out how to do it any other way. What I'd like to do is have clicking the Book Now button change the URL in the form action within the form with ID resForm, and then submit the form. I'm hoping someone can help me edit the form so that it accomplishes this. I'd be incredibly thankful. This is what I currently have: Code: <script> jQuery(document).ready(function($) { $(".book-now").click(function() { if($('#check-in').length > 0 && $('#DepartureDate').val() != '') { var data = $('#check-in').val(); var arr = data.split('/'); var datac = $('#DepartureDate').val(); var arr2 = datac.split('/'); var oneDay = 24*60*60*1000; // hours*minutes*seconds*milliseconds var firstDate = new Date(arr[2],arr[0] -1,arr[1]); var secondDate = new Date(arr2[2],arr2[0] -1,arr2[1]); var diffDays = Math.round((firstDate.getTime() - secondDate.getTime())/(oneDay)); if ((diffDays) < 0) { diffDays = Math.abs(diffDays); var link = "https://res.windsurfercrs.com/bbe/page1.aspx?propertyID=13841&checkin=" + arr[0] + "/" + arr[1] + "/" + arr[2] + "&nights=" + diffDays; console.log(link); window.location.href= link; } else { alert ('Please fill in correct Check-In and Check-Out dates. The Check-In date must be before the Check-Out date.'); } } else { alert ('Please fill in a Check-In and Check-Out date, thanks!'); } }); }); </script> The form looks like this: Code: <form action="#" onSubmit="_gaq.push(['_linkByPost',this]);" method="post" id="resForm"> <input type='text' name="checkin" id="check-in" readonly="readonly" style="cursor: text" data-default="MM/DD/YYYY" class='arrivaldate'/> <input name="checkout" id="DepartureDate" readonly="readonly" style="cursor: text" data-default="MM/DD/YYYY" class='departuredate'/> <input type="button" value="BOOK NOW" class='book-now' /> </form> Reply With Quote 01-25-2015, 12:46 AM #2 Old Pedant View Profile View Forum Posts Supreme Master coder! Join Date Feb 2009 Posts 28,310 Thanks 82 Thanked 4,754 Times in 4,716 Posts Just call the _gaq() function manually. Code: _gaq.push(['_linkByPost',document.getElementBy("resForm")]) window.location.href= link; Hi - Im pretty new to all this! Have created a form on my website, uploaded database to server, but when the form is submitted - instead of opening the property selection, it just lists the Index of /home/properties and files within that folder. Can anyone help me please? Perky
Need help adding var target to this form action Would This be correct? var form = inp.form; form.target = "_self"; Code: <html> </head> <script type="text/javascript"> function formop(inp,op) { var form = inp.form; form.action = op + ".php"; var temp = inp.id.split(","); form.id.value = temp[0]; form.FirstName.value = temp[1]; form.LastName.value = temp[2]; } </script> </head> <body> <form method="post"> <input type="hidden" name="id"> <input type="hidden" name="FirstName"> <input type="hidden" name="LastName"> <input type='image' id='show,me,data' onclick=formop(this,'add'); src='static/icon16/add.jpg'> <input type='image' id='show,me,data' onclick=formop(this,'edit'); src='static/icon16/edit.jpg'> <input type='image' id='show,me,data' onclick=formop(this,'delete'); src='static/icon16/delete.jpg'> </form> </body> OK I basically have a form field called prepend and if someone enters something in there I want it to prepend to my form action="" how can I insert anything into action ="" depending on what is entered I hope this makes sense. I AM SO LOST <script type="text/javascript"> function SearchGo(){ var searchField = document.getElementById("SearchInput"); var url = "http://url" document.location = url + encodeURIComponent(searchField.value); } </script> //field where URL will be entered and needs to be prepended <input type="text" name="prepend"> //form output is here <form name="searchform" target="_blank" action="";> <input type="button" value="Search" onClick="SearchGo();"/> Hi guys. I was wondering if its possible to switch a form action using javascript. Because im trying to have a search field on my main site for my forum and website. By having two boxes underneath my search field so people can select if the want to search my phpbb forum ore my site. Well anyway, mabey switching the form action is not the right approach. Any tips are welcome thanks. Hello guys, so i have a problem. i have a css/div box, and i have a login form. what im tryn to do is make it so that when i login, it it takes whats in the action of the form and shows it in the div box. the div box is like one of those cool popup boxes, it's done by using javascript and css. anyway, the div box works. the login form works. i just haven't been able to figure out how to get it to appear in the div instead of into a new page. so if any1 can help that would be much appreciated! here's my code: Code: <head><link rel="stylesheet" type="text/css" href="main.css" /> <link rel="stylesheet" type="text/css" href="popup.css" /></head> <form name="Login" method="post" action="login/check.php"> <table border="0" cellpadding="0" cellspacing="0"> <tr> <td>Username:</td> <td>Password:</td> </tr> <tr> <td><input name="myusername" type="text" class="txt" id="myusername"></td> <td><input name="mypassword" type="password" class="txt" id="mypassword"></td> <td><input type="submit" class="btn" name="Submit" value="Login" onmouseover='this.style.cursor="pointer" ' onfocus='this.blur();' onclick="document.getElementById('PopUp').style.display = 'block' "></td></tr> </table> </form> <div id='PopUp'> <br /> <div id="close"> <a id="link" onmouseover='this.style.cursor="pointer"' onfocus='this.blur();' onclick="document.getElementById('PopUp').style.display = 'none'"> <span id="span">Close</span></a> </div> </div> I have a form with an action url, but I need to alter it on submit. What I need to do is take the value of the text field, escape it, and append it on the end of the action url. Something like this: action url: /search/node appended action url: /search/node/some_escaped_string To do this, I create the function ahead of time and change the submit to a button with onClick. What isn't working is the escape mechanism. If I were to test for "ttt hhh", I'll get "/search/node/ttt hhh", instead of "/search/node/ttt%20hhh" Code: <script type="text/javascript"> function urlAppend() { termsValue = document.getElementById('terms').value; escapedVar = escape(termsValue); appendedUrl = "/search/node/" + escapedVar; location.href = appendedUrl; } </script> <form method="get" action="/search/node"> <input type="text" name="terms" id="terms"></input> <input type="button" value="Search" onClick="urlAppend();"> </form> Can someone tell me what I'm doing wrong? hi, Can any one tell how to change action attribute in form tag using javascript. thanks in advance regards sugeet I need for the submission of an unvalidated from to reload the page to allow for php validation which, if passed, would use javascript to change the form's action to an external site. First, is the following approach sound? Code: <script type="text/javascript"> if(my_php_validation_ok == true) document.form.action="the_external_url" else document.form.action="current_page.php" </script> Second, how should the <form> action be styled to accomplish this? Here is the code for test.html: Code: <html> <head><title></title></head> <body> <script type="text/javascript"> function OnSubmitForm(){ document.myform.action ="insert.html"; return true; } </script> <form name="myform" onsubmit="return OnSubmitForm()" method="get"> <input type='radio' name='Search' value='test'>test</input> </form> <a href='javascript:document.myform.submit()'><img src='images/buttonnext.jpg'></a> </body> </html> The way I want it to work: when the img (buttonnext.jpg) is clicked, the form is submitted. When the form is submitted it runs the javascript, which sets the action to be that insert.html is loaded. i.e. the end result should be to redirect to insert.html?Search=test The way that it is working now: the page is redirected to test.html?Search=test Note: If I use a submit button that is part of the form (i.e. input field with type "submit") the page is redirected correctly. What do I need to change to accomplish my goal? OK so I have a variable called url and I want to move its contents into the form action once the button is submitted. <script type="text/javascript"> function elibrarySearchGo(){ var url = "http://url'" } </script> <form name="searchform" target="_blank" action="" onsubmit=""> I need the syntax as to how to put in a variable coming from javascript inside onsubmit="document.form.action.value = variable" for example. Also, is it better to run this population of the action onsubmit or onclick? Thanks all in advance!! Hey all - I've searched high and low for this through Google, and tried piecing together some solutions, but 1) I'm way too incompetent from a Javascript perspective to take two ideas and make them work and 2) I've spent close to 2 hours and dont have a solution. SOOOO I thought I'd ask the geniuses here for some ideas: I have a page with an iFrame called portalCalcFrame that I'm trying to submit data to to do some calculations and preview in the iFrame before actually submitting the page to the next...well...page (both the "Recalculate" button to send to iFrame and the "Next Step" button to submit it further into the process are on the main frame). So I've got two problems. A) I need to submit a form to a different target, aka portalCalcFrame B) I need to submit the form to a different "action" page than my form actually submits to. (The form submits to a page called step2.php, whereas the iFrame needs to load page calcframe.php and have the form submit to that) I don't really know where to start, Javascript is far from my forte. I've taken it a couple of different ways. Any ideas guys? I love you long time. Thanks in advance! JE Hi Guys, I'm developing a registration form to be viewed on an iPad, this will be put on display in store for customers to complete. The idea is that once the form has been completed a success message will show in lightbox form (currently using query reveal) and then after a few seconds disappear and the form will be refreshed. Any idea on how to do this? I am using the below code but the obvious error is with the action. "<form name="signup" class="form" id="signup" action="data-reveal-id="myModal"" method="post" onsubmit="return validate_signup(this)">" All help very much appreciated. Hi, I have a body onload doing multiple things, changing a select option value, changing the form submit action and then auto submitting. Everything works fine until the auto submit part of it. Code: function run() { document.myform.myselect.selectedIndex = 1; document.myform.action = 'page.php?x=1&y=2'; document.myform.submit(); } <body onload="run()"> Thanks for any help with this Hi everyone In the below code i tried to write java scirpt in action attribute of form tag in html . Why i wrote that was i want to get the scirpt variable as a part of the url of the target page . I also tried using the location.href="targetpage?value="+value . But It is not redirecting to targetpage because of the action attribute in the form tag. And if we use location.href without action attribute only that script variable was posted and all other remaining textboxes and other form items are being not posted .. Thats why I wrote the scirpt in action attribute. I want the action attribute to work and also the java script variable to be posted .so i wrote the script tag in action attribute of form tag . I hope u got the Scenario . Please help me to resolve the issue.. Thank in advance .. <!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=iso-8859-1" /> <title>Untitled Document</title> </head> <body> <? if($_POST['submit'] ) { $var = $_GET['width'] ; } ?> <form name="form_submit" method="post" action="test2.php?width= '<script type= text/javascript> document.write(num)</script>' " onsubmit="return fun(); "> <script type="text/javascript"> function fun() { width = screen.width; height = screen.height; if (width > 0 && height >0) { window.location.href = "http://localhost/test2.php?width=" + width + "&height=" + height; } else exit(); } </script> <input type="text" name="txt" value="sample text" /> <input type="submit" name="submit" value="submit" /> </form> </body> </html> Iv been looking and trying to get something like this forever but cant find it so can some help: I need a script that when you click the link it has a popup box with a form in it but thats easy to find, what im having trouble finding is a script that when you click submit on the form it stays in the popup box and you could use the information submited in the form. Okay, first it should be noted I am a complete, 100% neophyte with javascript. I know HTML code pretty well, and I can do quite a bit of PHP as well, but it is all self-taught, so I am hardly an expert... and as I said, java is like French to me. I have a very simple website I've built, nothing complicated or dynamic - but we want to add one feature to this website which I have to say I am at a complete loss about. Basically, I want to have the main page of this website to have a popup form that somebody can plug in their name, email and zipcode load the first time somebody loads the page (which would obviously dump into a database or something), and then the next time the person goes to that page, that popup does not come up again. In other words, I want the feature to behave exactly like this: http://gopleader.gov/ Grey out the background, popup form, place a cookie so that in the future the popup doesn't load again, and that is it. I honestly am no kidding when I say I don't know javascript at all... so I would appreciate somebody helping me out with that in mind (in other words, don't just assume I know where I need to input my own custom values). Does anyone have any ideas here? In my index.php form I have a popup form. The user can click on a link on this popup form to call an order processing form. Is there a way for me to call this processing form from the popup and yet still close the popup form? In my index.php form there is also a link to call this order processing form, is there any way to call it from index.php but from the link on the popup form? Thanks... Hello, I have been trying to get my html form to submit to a php pop up window so that I can use the user entered data there... so far with little to no success. Here is my current code - Index.html Code: <script> function popup() { win = window.open('','myWin','toolbars=0'); document.post.action='popup.php'; document.post.rel="nofollow" target='myWin'; document.post.submit(); } </script> <div align="center"> <form name="post" action="popup.php" method="post" rel="nofollow" target="_self"> <input type="text" size="85" style="text-align: center" name="txttesturl" /> <br> <input type="button" name="post" class="submit" Value="Pop up" onclick"popup(); " /> </div> </form> popup.php Code: <?php $Testurl = $_POST["txttesturl"]; //Various bits of code ?> Any help would be greatly appreciated, as it stands I am getting NO response from the button. Edit - Nevermind..... I was missing an equals sign in the form ... |