I 'm writing a project based on Thymeleaf and I stuck with such a problem. I have a form which is supposed to be send on back-end. But before sending I have to perform some calculations with pages with the hepl of JS. So I decided to do something like that:
<form th:action= "'javascript:sendSearchRequest('this.form', '+${currentPage}+', '+${selectedPageSize}+')"
So in this case it seems to be impossible, because this.form can not be processed. Then I tried another approach:
<button id="searchButton" class="btn btn-default" type="submit"
onclick="return sendSearchRequest(this.form, this.currentPage, this.selectedPageSize)">Search
</button>
This time I cannot work with currentPage and selectedPageSize parameters, because I could only call for them only from thymleaf operators, like th:onclick for example.
So here is my question: is it possible to send both form parameter and some parameters from model like ${currentPage} in my example
You could add them as fields to your form (and access them in you sendSearchRequest).
<input type="hidden" th:value="${currentPage}" id="currentPage" />
<input type="hidden" th:value="${selectedPageSize}" id="selectedPageSize" />
or as data attributes on your form tag.
<form th:data-current-page="${currentPage}" th:selected-page-size="${selectedPageSize}" ...
I think you could fix your button click as well, to look like this:
<button id="searchButton" class="btn btn-default" type="submit" th:onclick="|return sendSearchRequest(this.form, ${currentPage}, ${selectedPageSize})|">
Search
</button>
Related
I'm trying to implement a simple search form in ASP.NET MVC. Right now my cshtml looks like this
#using (Html.BeginForm("SearchDemo", "Home", FormMethod.Post))
{
<div>
Last Name:<br>
<input type="text" id="nameToFind" name="nameToFind">
<input type="button" id="submitId" name="submit" value="submit" />
</div>
}
And my controller looks like this
[HttpPost]
public ActionResult SearchDemo(string nameToFind)
{
return RedirectToAction("Register", "Account"); //Only redirecting for now to test
}
Pressing the submit button does not call the controller but pressing ENTER does. I'm guessing that means my click event is getting eaten by JavaScript or something so I tried to pause script execution in Chrome but realized browserlink.js is stuck in an infinite loop. Is that the problem? Either way, how can I stop the infinite loop?
Browser doesn't know to use this button as submit.
Change
type="button"
To
type="submit"
Instead of setting the type as "button"
<input type="button" id="submitId" name="submit" value="submit" />
Change the type to submit
<input type="button" id="submitId" name="submit" value="submit" formmethod="post" value="Submit using POST"/>
You need a formmethod of post in your input.
So that the button knows to post back.
You also need a value attribute. This will be a reference to the Function name within the controller.
w3 reference
I am building a webapp using ASP.NET MVC.
In my application I need to change the functionality of a submit button in HTML code. Right now after clicking submit, the data is submitted and the page redirect to some particular one (I don't know why this one) but I want to stay at the same page. How can I achieve this? I have done research but all the answers didn't work for me.
The code of the button is following:
<button type="submit" value="Dodaj" class="btn btn-success" data-toggle="modal" data-target="#infoModal">Dodaj</button>
You can use javascript to this:
document.getElementById('yourform').onsubmit = function() {
return false;
};
or you can cancel page submit adding the class "cancel" in your <input>, example:
<input type="submit" ... class="cancel" />
#using (Html.BeginForm()) {
...
<input name="Save" type="submit" value="Save" />
}
#using (Html.BeginForm("MyController", "MyAction")) {
...
<input name="Save" type="submit" value="Save" />
}
You can set manually the redirection
The first one submits to the same action and same view is rendered
or
Inside the controller, there may be a code to redirect to some other action
The easiest way was to change the return value in the controller after the data was saved.
Thank you !
I have got Catalog and search bar(katalog3.php) in php , but funcionality in others files (search bar funcioanliy is search_example.php and catalogue funconality is example_show_model_detail.php) for now they display in funcionality page .... but i want the results of this be display(in katalog3.php) in concrete div(class="results") . How Can i achive it?
<form method="post" id="form1" action="example_show_model_details.php">
<button type="submit" form="form1" value="Submit">Submit</button>
</form>
<form method="post" id="fname" action="search_example.php">
Wyszukaj<input type="text" name="duren" id="duren"><br>
<button type="submit" form="fname" value="Submit">Submit1</button>
</form>
</div>
<div class="results">
</div>
From what I am reading it seems like you are looking for an ajax call to send data to another script and receive the response. If you are using jquery you can read more about it here: http://api.jquery.com/jquery.ajax/. In the event you are not using jquery you may want to take a look at this post: How to make an AJAX call without jQuery?.
I am writing a basic HTML Form which interfaces with JDBC to pass on the values to the DB.
Here are two lines of my code :
<form id="splash" action="http://localhost:8080/Practice01/DatabaseAccess" method="post">
<button type="submit" onclick="myFunction()" class="btn">Submit</button>
The current output is, when i submit the form, the pade is directed to http://localhost:8080/Practice01/DatabaseAccess. But i want to open another page on submit (or execute myFunction). A thank you page. How do i achieve this.
Any suggestions would be helpful.
create a code behind file to perform database operation and the redirect the code behind page to the page you want to open.
for example:
<form id="splash" action="<codebehindpage>" method="post">
<button type="submit" onclick="myFunction()" class="btn">Submit</button>
in the
response.redirect(<page you want to open>)
I am working on a web project using structs2. I have a form with submit button and another button. I am using javascript functions for form validation. My problem is that when I click the other button the form validation function works.
my jsp:
<h2>New Form</h2>
<s:form action="aa.action" name="myform" method="post" onsubmit="return(validateForm())">
<s:textfield name="formnumber" size="20" />
.
.
<button value="add" name="add">Add</button>
.
.
<s:submit method="create" key="xxx" value="xxx" />
When i click anyone of the the button the validation function will excecute.I dont want excecute the validation function on add button click.
Default button always submit the form so add type="button" it will stop
<button type="button" value="add" name="add">Add</button>
OR Use
<input type="button" name="add" value="Add" />
Get rid of the onclick. You don't need it here. The type="add" already submits the form. Your concrete problem is likely caused because the onclick of the <form> has returned false.
<input type="button" name="method" value="Add" class="button"
onclick="location.href='Employeelist.jsp'" />
You should mention type="button".
Otherwise it will submit the current URL again.
<button type="button" value="Add" name="add"/>
details about "type" in html
http://www.w3schools.com/tags/att_button_type.asp
Java Script Form validation can be
w3schools
Tutorials point
javaScript Coder
if you familier with java script libraries you can use validate.js
type : What type of widget you want.
vlaue : The text what you want in that.
name : The id of that purticulat widget.