How can I navigate to a new page without triggering the jQuery mobile form handling, which creates a ajax request and then loads the page with it's speczial funcationallity (I don't know the name for it)
Add this attribute to the form:
data-ajax="false"
Example:
<form action="demo.php" method="post" id="check-user" class="ui-body ui-body-a ui-corner-all" data-ajax="false">
<fieldset>
<div data-role="fieldcontain">
<label for="username">Enter your username:</label>
<input type="text" value="" name="username" id="username"/>
</div>
<div data-role="fieldcontain">
<label for="password">Enter your password:</label>
<input type="password" value="" name="password" id="password"/>
</div>
<input type="button" data-theme="b" name="submit" id="submit" value="Submit">
</fieldset>
</form>
Related
Whenever I try sending an email through an email form I made, it redirects me to another page that keeps loading for several minutes. After a random amount of time (from minutes, to even days), I get the email I sent.
I'm not sure why this is happening and have not yet found a solution. This is my code for the form:
<div class="mail">
<h1 style="font-size: 50px;">Contact Us</h1>
<form target="_blank" action="https://formsubmit.co/xxxx#gmail.com" method="POST">
<div class="form-group">
<input type="hidden" name="_template" value="table">
<div class="form-row">
<div class="col">
<input type="text" name="name" class="form-control" placeholder="Full Name" required>
</div>
<div class="col">
<input type="email" name="email" class="form-control" placeholder="Email Address" required>
</div>
</div>
</div>
<div class="form-group">
<textarea placeholder="Your Message" class="form-control" name="message" rows="10" required></textarea>
</div>
<button type="submit" class="btn btn-lg btn-dark btn-block">Submit Form</button>
</form>
I've the following form on JSP:
<form class="form-horizontal" style="margin-bottom: 24px">
<fieldset id="myFieldset" disabled>
<div class="form-group">
<label class="control-label col-sm-3" style="text-align: left">Created By</label>
<div class="col-sm-4">
<input class="form-control" type="text" name="created_by" value="${inputConfiguration.getCreatedBy()}" readonly/>
</div>
</div>
.
.
. few more divs of form-group
.
.
</fieldset>
<div class="form-group row">
<div class="col-sm-offset-4">
<form action="${pageContext.request.contextPath}/Configuration/EditConfiguration" method="GET">
<input type="hidden" name="marketplace" value="${param.marketplace}">
<input type="hidden" name="program" value="${param.program}">
<button class="btn btn-primary"> form_Edit </button>
</form>
</div>
<div class="col-sm-1">
<form action="${pageContext.request.contextPath}/Configuration/CopyConfiguration" method="GET">
<input type="hidden" name="marketplace" value="${param.marketplace}">
<input type="hidden" name="program" value="${param.program}">
<button class="btn btn-primary"> form_Copy to New </button>
</form>
</div>
</div>
</form>
However, the forms that are within the outer-form are not redirecting to the correct path on clicking their respective buttons. NOTE: the hidden input fields are just to pass them as url parameters to the paths mentioned in the action and nothing else. Can anyone suggest as to how to pass these as url params and how to make the nested forms work?
can I use only the layout of the form in bootstrap and have the input option frozen and the submit buttons behave like plain html button which redirects somewhere?
Why I want this?
So in the homepage I have resources which can be deleted pressing the delete button against them. On clicking the delete button the resource data is displayed like the layout of a form, of course I want typing inputs to be disabled, and a warning message on top, and YES and RESET option at the bottom. Since the form has a specific action assigned via GET method it will invariably perform that action irrespective of the choice selected. So if RESET is also selected the resource still gets deleted.
One option is to have the buttons as individual links with specific redirection properties but then I need to handcode the entire styling of the form.
Below is the code
#elseif($layout=='delete')
<div class="container-fluid mt-4">
<div class="row">
<section class="col md-7">
<div class="card mb-3">
<img src="https://cdn.pixabay.com/photo/2014/05/05/19/53/keyboard-338502_1280.jpg" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Are you sure you want to delete</h5>
<form action="{{url('/destroy/'.$student->id)}}" method="get">
#csrf
<div class="form-group">
<label>CNE</label>
<input value="{{ $student->cne }}" type="text" class="form-control" name="cne" placeholder="Enter CNE">
</div>
<div class="form-group">
<label>FirstName</label>
<input value="{{ $student->firstName }}" type="text" class="form-control" name="firstName" placeholder="Enter the first Name">
</div>
<div class="form-group">
<label>Last Name</label>
<input value="{{ $student->LastName }}" type="text" class="form-control" name="LastName" placeholder="Enter the Last Name">
</div>
<div class="form-group">
<label>Age</label>
<input value="{{ $student->age }}" type="text" class="form-control" name="age" placeholder="Enter Age">
</div>
<div class="form-group">
<label>Speciality</label>
<input value="{{ $student->Speciality }}" type="text" class="form-control" name="Speciality" placeholder="Enter the speciality">
</div>
<input type="submit" class="btn btn-info" value="yes">
<input type="submit" class="btn btn-warning" value="reset">
</form>
</div>
</div>
</section>
Firstly, if you want disable input, add readonly to your inputs :
<input value="{{ $student->cne }}" type="text" class="form-control" name="cne" placeholder="Enter CNE" readonly>
Second, now the type of your reset button = submit so when you click it, your form is submitted. Change your code :
<input type="reset" class="btn btn-warning" value="reset">
I have a mailing list sign up form on my website, and the button that fires it has got <input type="submit" . However, when I visit my website on my iPhone, the go button does not do anything. How do I fix this? Here is my full code:
<div id="mc_embed_signup">
<form action="//isaacadni.us10.list-manage.com/subscribe/post?u=0db50d6b1ce1ac34d3194a969&id=0026019372" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
<div class="form-group">
<input type="email" value="" name="EMAIL" class="email form-control input-lg" id="mce-EMAIL" placeholder="email address" required>
<!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
<div style="position: absolute; left: -5000px;"><input type="text" name="b_0db50d6b1ce1ac34d3194a969_0026019372" tabindex="-1" value=""></div>
<br>
<input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" btnSubmitclass="btn btn-primary btn-lg">
</div>
</form>
</div>
Remove target="_blank" from the <form> element.
You can force it by replacing your input line with this,
<input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" onclick="document.getElementById('mce-EMAIL').submit()" btnSubmitclass="btn btn-primary btn-lg">
I'm building a site which has a form but for some reason, even if a user doesn't enter info into the form (even if the form hasn't been presented yet - it starts out hidden) - if I refresh the page, iOS gives me a browser alert stating:
are you sure you want to submit this form again?
Any idea why this happens or how to suppress that?
This is my form code:
<div id="vehicle_form">
<form method="post" name="emailForm">
<input class="dField" id="dfEmail" type="email" name="email" value="Email"/><br/>
<input class="dField" id="dfName" type="text" name="firstname" value="First Name"/><br/>
<input class="dField" id="dfLast" type="text" name="lastname" value="Last Name"/><br/>
<input class="dField" id="dfZip" type="text" maxlength="5" name="zip" value="Zip Code"/><br/>
<button id="dFormBack">Back</button><button type="submit" id="dSubmit">Submit</button>
</form>
<div id="dErrors"></div>
</div>
I also have this javascript acting on the form fields:
$j('.dField').focus(function(){
clearInput($j(this)[0]); //The [0] seems to be necessary to retrieve the element at the DOM object level
}).blur(function(){
restoreInput($j(this)[0]);
});
as well as some other form related javascript.
Not sure if this is exactly what you're looking for, but try this:
<form method="post" name="emailForm">
<input type="text" name="email" value="Email" size="30" onfocus="value=''"><br>
<input type="text" name="firstname" value="First Name" size="30" onfocus="value=''"><br>
<input type="text" name="lastname" value="Last Name" size="30" onfocus="value=''"><br>
<input type="text" name="zipcode" value="Zip Code" size="30" onfocus="value=''"><br>
<button id="dFormBack">Back</button><button type="submit" id="dSubmit">Submit</button>
</form>