$(document).ready(function () {
$("#GetUser").click(function (event) {
event.preventDefault(); // prevents the form from submitting
$.ajax({
url: "/Home/GetNomPreNom", /// url to the controller method
data: { val: $("#TelNum").val() }, // get the textbox value: this will be the TelNum textbox
success: function (data) { // if the call is successful, the return value is inserted into "data"
$("#NomPreNom").html(data); //This updates the label with the value inserted into "data"
}
});
}
);
});
If you do not care about what happens if the user has javascript disabled, then just make the type of the button to be "button" rather than "submit". Buttons do not cause any action, other than those defined in a handler.
marwa580
Member
18 Points
51 Posts
stay in the same page
Jan 29, 2013 01:04 AM|LINK
Hi,
I would like to stay in the same page when I click on a button
(this page contain a partial view)
how can I do it ?
I tried this
<% using(Html.BeginForm()) { %>but it did not work !
innological
Member
142 Points
24 Posts
Re: stay in the same page
Jan 29, 2013 02:51 AM|LINK
You need to handle the click of the button or submit of the form and cancel the default handling. For e.g.
If your html is like the following,
<form id="myForm"> <input id="submitButton" type="submit" value="Submit" /> </form>Then you need a javascript like the following
$("#submitButton").on("click", function(e) { e.preventDefault(); return false; });or
$("#myForm").on("submit", function(e) { e.preventDefault(); return false; });If you are using Html.BeginForm mvc html helper, define the id attribute using one of the method's variants.
DotCastle Team
http://www.dotcastle.com
Note: Please mark this post as ANSWER if it addresses your question/issue
pro.shailend...
Participant
1000 Points
189 Posts
Re: stay in the same page
Jan 29, 2013 04:13 AM|LINK
Refer the link for handling submit button on your page in different ways
http://www.dotnet-tricks.com/Tutorial/mvc/cM1X161112-Handling-multiple-submit-buttons-on-the-same-form---MVC-Razor.html
It may help you.
Blog: Dot Net Tricks Windows Apps
Please "Mark As Answer" if my suggestions helps you
marwa580
Member
18 Points
51 Posts
Re: stay in the same page
Jan 29, 2013 06:28 PM|LINK
I try this but it redirect me to another page !!
$(document).ready(function () { $("#GetUser").click(function (event) { event.preventDefault(); // prevents the form from submitting $.ajax({ url: "/Home/GetNomPreNom", /// url to the controller method data: { val: $("#TelNum").val() }, // get the textbox value: this will be the TelNum textbox success: function (data) { // if the call is successful, the return value is inserted into "data" $("#NomPreNom").html(data); //This updates the label with the value inserted into "data" } }); } ); });Erik.SM
Member
332 Points
61 Posts
Re: stay in the same page
Jan 29, 2013 06:32 PM|LINK
If you do not care about what happens if the user has javascript disabled, then just make the type of the button to be "button" rather than "submit". Buttons do not cause any action, other than those defined in a handler.
marwa580
Member
18 Points
51 Posts
Re: stay in the same page
Jan 29, 2013 06:47 PM|LINK
it stay in the same page without doing what I have to do !!!
Erik.SM
Member
332 Points
61 Posts
Re: stay in the same page
Jan 29, 2013 06:54 PM|LINK
Use your javascript debugger to determine if there are any errors occuring. Errors can cause the javascript to not execute.
If you're going to be doing frequent Ajax, you should also install an Html debugger, like Fiddler.
marwa580
Member
18 Points
51 Posts
Re: stay in the same page
Jan 29, 2013 06:59 PM|LINK
I don't understand ! how can I do it ?
Erik.SM
Member
332 Points
61 Posts
Re: stay in the same page
Jan 29, 2013 07:17 PM|LINK
This is too large of a topic to discuss here. Do some reading on debugging javascript. Here's a good starting place:
http://berniesumption.com/software/how-to-debug-javascript-in-internet-explorer/
marwa580
Member
18 Points
51 Posts
Re: stay in the same page
Jan 29, 2013 08:03 PM|LINK
I show you what I have in my partial view :
<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<MvcApp.Models.Paiements>" %> <script src="../../Scripts/MicrosoftAjax.js" type="text/javascript"></script> <script src="../../Scripts/MicrosoftMvcAjax.js" type="text/javascript"></script> <script src="../../Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> <script src="../../Scripts/jquery.unobtrusive-ajax.js" type="text/javascript"></script> <% using(Html.BeginForm()) { %> <fieldset> <label for="montant"> Montant :</label> <div class="editor-field"> <%: Html.EditorFor(model => model.montant_P)%> <%: Html.ValidationMessageFor(model => model.montant_P)%> </div> <label for="NumTel"> Numéro de téléphone </label> <div class="editor-field"> <input type="text" id="TelNum" /> </div> <%: Html.HiddenFor(model=>model.Nom) %> <%: Html.HiddenFor(model=>model.Prenom) %> <%: Html.HiddenFor(model=>model.idP) %> <%: Html.HiddenFor(model=>model.Type_P) %> <%: Html.HiddenFor(model=>model.date_P) %> <%: Html.HiddenFor(model=>model.NumCompte) %> <input type="submit" id="GetUser" value="GetUser" onclick="show()" /> <br /> <br /> <div id"container1"> <label id="NomPreNom"> </label> </div> <br /> <div id="label1" style="visibility: hidden;"> Veuillez entrer votre code PIN: <div class="editor-field"> <%: Html.EditorFor(model => model.CodePIN) %> <%: Html.ValidationMessageFor(model => model.CodePIN) %> </div> <input type="submit" id="Submit1" value="Valider" /> </div> <% } %> <script type="text/javascript"> $(document).ready(function () { $("#GetUser").click(function (event) { event.preventDefault(); // prevents the form from submitting $.ajax({ url: "/Home/GetNomPreNom", /// url to the controller method data: { val: $("#TelNum").val() }, // get the textbox value: this will be the TelNum textbox success: function (data) { // if the call is successful, the return value is inserted into "data" $("#NomPreNom").html(data); //This updates the label with the value inserted into "data" } }); } ); }); function hide() { var div_ref = document.getElementById("label1"); div_ref.style.visibility = "hidden"; } function show() { var div_ref = document.getElementById("label1"); div_ref.style.visibility = "visible"; } </script>I try the solution that you suggest and an errror is displayed :
Line: 1
Erreur : « show » est indéfini
function onclick(event)
{
show()
}