I have a button within a form.
The thing is when I click it, it does not execute the server side function.
Is it possible to prevent form submission, while executing server functions and client side validations ?
Thanks in advance.
html (inside a form)
<button class="submit" runat="server" id="v4" onserverclick="v4_Click" >Validate</button>
jquery
$('#v4').click(function (event) {
if (validation()) {
slideToStep(5);
}
return false;
});
c#
protected void v4_Click(object sender, System.EventArgs e)
{
System.Diagnostics.Debug.Write("test");
}
Is it possible to prevent form submission yes it is
you can simply write e.preventDefault()/Return false() on jquery click of button
But again While using server side function i am not getting this
I believe you can achieve what you're wanting, by binding the event.preventDefault() to the submit event of the form, rather than the click event of the button.
Setup an onclick for your button to call a function that submits your form.
<button class="submit" id="v4" onclick="SubmitForm();" runat="server" onserverclick="v4_Click" >Validate</button>
Set the SubmitForm() function to submit the form, then bind a function to your submit event:
function SubmitForm() {
$('#form1').submit();
}
$(function () {
$('#form1').submit(function (event) {
if (validation()) {
slideToStep(5);
}
else
{
//Validation Failed, prevent form from submitting.
event.preventDefault();
}
});
});
The problem is in your javascript code, in your case return false is always called, instead you should only call it when your validation fails:
$('#v4').click(function (event) {
if (validation()) {
slideToStep(5);
} else{
return false;
}
});
Edit:
Basically, if you want to call the button_click event, you need to submit the form, in your case I would use a WebMethod to call a server side validation function with ajax. Something like this:
c#:
[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public static string Validate(string params)
{
// your validations
return "Received : " + params;
}
jquery:
$(document).ready(function() {
$("#v4").click(function() {
$.ajax({
type: "POST",
url: "Default.aspx/Validate",
data: "{params: 5 }",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(msg) {
alert(msg.d);
}
});
Alternative:
You could also use a customValidator, and ASP will do all of the jquery stuff for you.
Related
I have a function in jQuery which submits to 2 forms in ASP.NET MVC 4.
What can I implement so that the first form called "fdata" is executed and once I finish checking that the submit has been successful and continue with the second form called "fbulk"?
$("#fdata, #fbulk").on("submit", function (e) {
// prevent the default form-post
e.preventDefault();
$.post($("#fdata").prop('action'), $("#fdata").serialize(), function () {
// first form post complete
});
$.post($("#fbulk").prop('action'), $("#fbulk").serialize(), function () {
// second form post complete
});
});
Thank you.
As #Eldar and #Sadeq Hatami said just move the second post to first post
$("#fdata, #fbulk").on("submit", function (e) {
// prevent the default form-post
e.preventDefault();
$.post($("#fdata").prop('action'), $("#fdata").serialize(), function () {
$.post($("#fbulk").prop('action'), $("#fbulk").serialize(), function () {
});
});
});
Is there any way to call the click function from the c# application
Here's the code that set the function:
$('#connectbtn').unbind('click').attr('disabled', false);
$('#connectbtn').bind('click', function() {
//CODE TO BE EXECUTED
}).removeAttr('disabled');
try it,
ClientScript.RegisterStartupScript(this.GetType(), "DateTimeFromServer", string.Format(#"<script>
$(function () {{
$('#connectbtn').trigger('click','{0}');
}});
</script>", DateTime.Now));
i am trying to implement a button click event and trying to call it in my java script function without actually clicking the button.
protected void btn_hid_Click(object sender, EventArgs e) {
string fbid = tb_id.Text;
query = "select userid from users where fbid='" + fbid + "'";
ds = db.SelectDs(query);
}
now i want to call this function in javascript function as soon as page load occurs and java script is called.
function func() {
alert("hiden");
$(document).ready(function () {
control or simple html control
$("[id*='btn_hid']").click();
});
alert("hiden end");
}
but this is not happening.Could you please tell how to do it?
You can try with this code
btn_hid.Attributes.Add("onclick","return YourFunction()");
Nota : if your wish also register dynamically your script you can use
var script = "";
Page.RegisterStartupScript("YourkeyOfScript",script);
Nota : You can also use OnClientClick in your interface
Your code is right. but It may be some problem. you can try with the alternate code.
using the following line of code.
__doPostBack('<%= btn_hid.ClientID %>', '')
I have the following:
public MainPage()
{
webBrowser1.ScriptNotify += new EventHandler<NotifyEventArgs>(webBrowser1_ScriptNotify);
}
void webBrowser1_ScriptNotify(object sender, NotifyEventArgs e)
{
// ... some code ...
webBrowser1.InvokeScript("nativeCallback", response.Serialize());
}
The script notify is triggered when a user presses a button on the web page. I am trying to invoke the JavaScript below but i keep getting Error 80020101.
<script type="text/javascript">
function nativeCallback(e){
document.getElementById('callbackDiv').appendChild("<b>" + e + "</b>");
}
</script>
80020101 means that there is a problem compiling the function ready to execute it.
The problem is that appendChild() is expecting a node to be passed and you're giving it a string.
Try this instead:
<script type="text/javascript">
function nativeCallback(e){
var b = document.createElement('b');
b.innerHTML = e;
document.getElementById('callbackDiv').appendChild(b);
}
</script>
You can also access callbackDiv directly:
callbackDiv.appendChild(b);
i have a button1_click() function which runs on page load,,now i want to call this function from javascript,,for that purpose i need to do dopostback in javascript,,can nyone tell how can i do that..as u can see my pageload function that button1_click() runs on postback
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
int l = files.Length;
Button1.Attributes.Add("onclick", " alertMe("+ l.ToString() +");");
}
Button1_Click();
}
my javascript code :
function alertMe(len)
{
if(len>3)
//do postback(post back will run Button1_click function)
else
alert('Hello');
}
This is a helpful link
From the article:
"
Calling postback event from Javascript
There may be some scenario where you may want to explicitly postback to the server using some clientside javascript. It is pretty simple to do this.
ASP.NET already creates a client side javascript method as shown below to support Postbacks for the web controls:
function __doPostBack(eventTarget, eventArgument) {
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
theForm.__EVENTTARGET.value = eventTarget;
theForm.__EVENTARGUMENT.value = eventArgument;
theForm.submit();
}
}
"
one way would be to use an actual asp:Button and utilize the OnClientClick event...
<asp:Button id="myButton" runat="Server" OnClick="Button1_Click" OnClientClick="alertMe();" />
function alertMe()
{
if (this.len>3)
{
return true;
}
else
{
return false;
}
}
if alertMe returns true, the the postback to the server will occur, if it returns false,
it won't.
here is a link to more details on the OnClientClick event.
It looks like you want to use ajax to call this server method. You can use ajax.net to do this. Obviously as a result it will not be postback.
Have a look here for examples
Possibly this:
function alertMe(len)
{
if(len>3)
//do postback(post back will run Button1_click function)
alertMe(len);
else
alert('Hello');
}
I would always try to avoid inline js though