On every page of my website, I have the following form in the sidebar (don't worry about the static values of the form):
<form target="booking_iframe" name="form1" method="post" action="/booking" id="le_booking_form">
<div class="form_row">CHECK IN
<input name="side_check_in_date" type="text" class="stwths_input" id="checkin" value="2012-03-05">
</div>
<div class="form_row">CHECK OUT
<input name="side_check_out_date" type="text" class="stwths_input" id="checkout" value="2012-03-10">
</div>
<div class="stwths_submit_box"><input type="submit" name="button" id="button" value="Submit" class="stwths_submit" rel="follow"></div>
</form>
What the form needs to do is POST the side_check_in_date and side_check_out_date to an iFrame on the booking page which the form sends you to when you hit Submit so the user can fill in the form that appears on this booking page.
Here's the code from the booking page:
<iframe name="booking_iframe" src="http://thestrandreservation.spin-demo.com/?ptype=user_booking" width="690" height="3000" border="0" frameborder="0" scrolling="no"></iframe>
You can see the home and booking pages below:
http://thestrand.spin-demo.com/
http://thestrand.spin-demo.com/booking
On the booking page, you need to insert value="{CHECK_IN_DATE}" and value="{CHECK_OUT_DATE}" into your form with the id="reservation_frm". That needs to happen server side, because you are posting this data from your stay_withus_form.
I don't know what server technology you are using, whether it's php, ruby, or .net it doesn't matter.
Then use Javascript on the booking page to submit the reservation_frm form:
using plain old Javascript:
document.forms["reservation_frm"].submit();
or using jQuery
$("#reservation_frm").submit();
Related
Long and short, I had a form input button on my site that worked as an access code to redirect to a specific page on the site. Site broke, and now I don't remember the code I had in place. It was done a long time ago and I only had to do it once. But the gist of it looks like this:
For example the address to site is www.brokensite.com. I had a form input field on the page where the value of the input field when submitted redirected to the page www.brokensite.com/inputvalue. So if I input the access code of helpme, it would redirect to www.brokensite.com/helpme
My current code is:
<form action="/after-school-registration/" method="$_GET" name="access">
<input name="code" value="" type="Text">
<input value="Go" type="Submit">
</form>
Please tell me what I am missing. Or what I did wrong this time. Any help is appreciated.
You could use JavaScript and set the location:
<form>
<input id='urlpage' />
<button type="button" onclick="window.location.href='/after-school-registration/' + document.getElementById('urlpage').value">Go</button>
</form>
I am trying to abstract the login form from an html page. Is it possible to have the contents of the form in one file and include the contents into an html page. I am doing this in asp.net, and I would prefer to put the content of the form in a .aspx or .ascx file.
Currently the only way I can think of doing this would be to use some javascript hack which I would prefer to stay away from.
<form id="login">
<div class="form-group">
<label for="username">Username</label>
<input type="text" class="form-control" id="username" placeholder="Username">
</div>
<div class="form-group">
<label for="password">Password</label>
<input type="password" class="form-control" id="password" placeholder="Password">
</div>
<button type="submit" class="btn btn-default btn-block">Sign In</button>
<small>Forgot your password?</small>
</form>
So I want to take labels and inputs and put them in another file. Is it possible to include them into this formusing my .aspx file?
I presume you're using web forms? Because ASP.Net MVC lets you do whatever you want to the html.
In that case, remember that Web Forms has one special form, that normally looks like this:
<html>
<body>
<form id="theForm" runat="server">
<!-- everything goes in here -->
</form>
</body>
</html>
The trick is that Web Forms has two rules about this form: it should be the only form with the runat="server" attribute, and it doesn't like it if you nest another form element inside the special form. However, you are perfectly free to include another form element on the page that's outside of this form element and does not use the runat="server" attribute:
<html>
<body>
<form id="login" action="...">
<!-- login stuff goes here -->
</form>
<form id="theForm" runat="server">
<!-- everything else goes in here -->
</form>
</body>
</html>
And of course you can use css styles to position that new form however you want on the page, within the limits of css.
That out of the way, you're also talking about moving this code to another file. Specifically, it sounds like you're wanting to use an older include directive. Those aren't really considered good practice anymore, but you do have a number of options available. In Web Forms, this could be part of your Master page. In MVC, it might be something like Partial View (scroll down at the link). Additionally, with Web Forms, you could implement this as a user control, where you don't need the form element any more. Instead, you rely on the form from the ASP.Net page, and just supply the server controls and code for the login button.
I'm trying to open a form action url in a iframe which is in another html page.
I successfully opened it in a iframe which is on the same page with this code:
<form class="form" action="myConnexionURL" target="iframe-myAccount" method="post">
<input type="text" id="login" name="login" placeholder="ID">
<input type="password" id="pass" name="pass" placeholder="PSW">
<input type="submit" value="Connexion">
</form>
<iframe src="" name="iframe-myAccount"></frame>
So, my question is simple: How can I open the form action url in an iframe which is in another html page?
As far as I know, there is no way to access that iFrame directly. I think you'll have to pass the data to the parent and then have it adjust the URL for the embedded iFrame. I'd probably do this through server-side scripting, but you may be able to do it through JavaScript.
I have a form that looks like:
<form id="search-form" action="about:blank" target="none">
<input type="text" id="search-text">
<button id="search-submit"> Go! </button>
</form>
<iframe name="none" style="display:none"></iframe>
While I don't want my form to update the page, yet I want autocomplete to work properly so I send a blank page to the iframe every time the form is submitted.
Will this solution work on every browser? (Or should I create a "/blank" blank page response on the server...)
I have a form which I'd like to post to the same page. The form action contains a fragment identifier for the element on the page that contains it - what I want it to do is post the data, then reload the same page at the same point so the user doesn't need to scroll down.
example index.php:
<div>
some very long content that pushes my form down the page
</div>
<div id="myDiv">
<form action="index.php#myDiv" method="post">
<input name="abc" value="123"/>
<input type="submit" value="submit"/>
</form>
</div>
However I have a couple of problems - firstly I'm not sure if this is good practice and can't find much on what is considered good practice with fragment identifiers.
Second, some others have said that sometimes the form "jumps to the top" when they click submit. I haven't been able to reproduce this yet but it seems pretty obvious that instead of posting the data, the browser is going with the fragment identifier action instead.
Can anyone suggest a better way to do this?
Redirect the user after the form submission using header() function along with identifier.
<div>
some very long content that pushes my form down the page
</div>
/*Use header() to redirect the person on the #point*/
<?php
//form data goes here, if it passes everything then use
header('Location:index.php#myDiv');
exit;
?>
<div id="myDiv">
<form action="index.php" method="post">
<input name="abc" value="123"/>
<input type="submit" value="submit"/>
</form>
</div>