sweet alert is stoping my data insertion - javascript

i am working on web-form where simple insertion is being place. i write a JS block to show success popup with the help of sweet alert. onclientclick i calling java script. javascript block work fine but no data insert into database.
that my java script code
<script type="text/javascript">
function massege() {
swal({
title: 'Congratulation!',
text: 'Your Data has been saved',
type: 'success',
confirmButtonText: 'ok'
},
function(){
window.location.href = 'RegisterRoute.aspx';
});
}
</script>
here my button code
<asp:Button ID="id" type="submit" runat="server" CssClass="btn pull-right" Text="Register Route" OnClick="RouteRegistration_Click" OnClientClick="massege(); return false" />
i had try it with another way like below
ClientScript.RegisterStartupScript(this.GetType(), "success", "massege();", true);
but from this method popup don't show. any idea what going wrong.

return false may be preventing to submit the request. Remove return false from below line and try. Attach the click event as..
OnclientClick="message();"
<asp:Button ID="RouteRegistration" type="submit" runat="server" CssClass="btn pull-right" Text="Register Route" OnClick="RouteRegistration_Click" OnClientClick="massege();" />

Related

Radio button change event not working with RightClick error

I have radio buttons on click of which I want to perform some actions. The change events are not working and it shows following error,
Uncaught referenceerror: RightClick is not defined at onload
Here is my code that I am using, Please can I have some insight on this error.
$(document).ready(function() {
console.log('In jQuery');
$('#rblKnowAboutCourse').change(function() {
console.log('In jQuery-On Click2-Sarvesh');
if ($(this).val() == "Other") {
$("#TextBox1").prop("disabled", false);
} else {
$("#TextBox1").prop("disabled", true);
}
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
Click: <input type="radio" id="rblKnowAboutCourse" />
<input type="text" id="TextBox1" value="" placeholder="textbox" />
The error shows link for this line in html
<body style="font-size:11px" onload="RightClick.init();">
Here is the radios i am using,
<asp:RadioButtonList ID="rblKnowAboutCourse" runat="server" Font-Size="Medium" Height="30px" Width="708px" TextAlign="Right" RepeatDirection="Horizontal">
<asp:ListItem>Website</asp:ListItem>
<asp:ListItem>Friends</asp:ListItem>
<asp:ListItem>Your Company</asp:ListItem>
<asp:ListItem>Online Ad</asp:ListItem>
<asp:ListItem>other</asp:ListItem>
</asp:RadioButtonList>
Thank you for the concern everyone has shown. My issue resolved just by changing the id to class.

Why this alert doesn't work using javascript?

I'm working on ASP.NET and on the view I have a code like this, If I use the sweet alert outside the function it works, and If I change the sweet alert in to a regular alert it works too but It doesn't work like the code below. (I also have the script with the library on the view)
<input type="submit" value="Create" class="btn btn-default" onclick="return foo();" />
<script type="text/javascript">
function foo() {
swal("Good job!", "You clicked the button!", "success")
return true;
}
</script>
When you click the submit button, it is submitting a form.
With an alert, it blocks the browser so the code will wait until you push okay and than submit the form. But the issue when you move to use sweet alert, you can not block the browser action. So you will have to cancel the click and submit the form manually.
// called onclick of the submit button
function foo() {
swal("foo")
.then(function() {
// manually submit the form
document.getElementById("yourFormId").submit()
});
return false; // cancel the button click
}
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<form id="yourFormId">
<input type="submit" value="Create" class="btn btn-default" onclick="return foo();" />
</form>
ok, you forgot to include library js and css
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.js"></script>
<input type="submit" value="Create" class="btn btn-default" onclick="return foo();" />
<script type="text/javascript">
function foo() {
swal("Good job!", "You clicked the button!", "success")
return true;
}
</script>

How to click on an input type"submit" button without submiting the whole form

I am trying to click the following line of code:
<input title="Add To Cart" name="pdp_addtocart" value="Add To Cart" type="submit" class="active_step">
I have tried the .click() form and it doesnt work. I need the code in javascript.
With Jquery:
var my_btn = $('input[name="pdp_addtocart"]');
my_btn.click(function(event){
event.preventDefault(); //This avoid the default behavior of the button
//Your Stuff
});
In case your form still sending add this line:
$('form').submit(function(event){
event.preventDefault(); //This avoid the behavior of sending the form
});
Try adding the onclick event to the button:
<input onclick="return false;".... />
return false in the event will halt the form submission.
or using pure javascript:
theButton.onclick = function() {
return false;
};
Edit:
jQuery version:
$theBtn.click(function() {
return false;
});
Does it have to be a <input type="submit" />?
You could use a <input type="button" /> instead.

Why button doesnt fire javascript function

I have no idea why the button click function is not firing in Javascript, am I missing something? I tried:
aspx.page
<input type="button" id="tglBtn" onclick="changeName(this) " runat="server" />
or
<input type="button" id="tglBtn" OnClientClick="changeName(this);" runat="server" />
or
<input type="button" id="tglBtn" OnClientClick="changeName(this);return false;" runat="server" />
Javascript
function changeName(obj) {
alert("hey");
if ($(obj).attr("Value") == "Open") {
$(obj).val("Close");
}
else {
$(obj).val("Open");
}
}
Actually it work so fine to me.
Here is my code:
<script src="js/jquery.min.js" type="text/javascript"></script>
<input type="button" id="tglbtn" onclick="changeName(this)" runat="server" />
<script type="text/javascript">
function changeName(obj) {
alert("hey");
if ($(obj).attr("Value") == "Open") {
$(obj).val("Close");
}
else {
$(obj).val("Open");
}
}
</script>
Do you have jQuery? If you dont have just add a jQuery..
I think you made a mistake... now try this...
<asp:Button id="tglBtn" OnClientClick="return changeName()" runat="server"><asp>
The OnClientClick is work on asp.net controls (not on html controls that you have apply the run on server).
So the first line is only left.
<input type="button" id="tglBtn" onclick="changeName(this) " runat="server" />
This line is run, but at the same time you make Post Back, so you probably not have the time to see the results of javascript. Of course you may have some other javascript bugs, if you open your browser console you can see if the javascript runs with out errors.
Use ASP:Button instead.
see below code
<asp:Button runat="server" id="tglBtn" onclientclick="return changeName()" Text="submit" />
//in head section
<script language="Javascript">
function changeName()
{
alert("I am in function");
document.getElementById("tglBtn").value = "New name";
return false;
}
</script>
it will resolve your issue

Button onClick gets executed two times on Mozilla

I have a javascript on a button, to transform the text to "Wait..." after it is clicked. The problem is that on Mozilla it gets executed two times after the click. This is the code:
System.Text.StringBuilder sb = new System.Text.StringBuilder();
sb.Append("if (typeof(Page_ClientValidate) == 'function') { ");
sb.Append("if (Page_ClientValidate() == false) { return false; }} ");
sb.Append("this.value = 'Please wait...';");
sb.Append("this.disabled = true;");
sb.Append(this.Page.ClientScript.GetPostBackEventReference(this.btnSave, ""));
sb.Append(";");
this.btnSave.Attributes.Add("onclick", sb.ToString());
the html is:
<div class="btns-action">
<input type="submit" value="Submit" id="btnSave" runat="server" style="margin-left: 112px;"
onserverclick="btnSave_Click" class="ui-button ui-widget ui-state-default ui-corner-all" />
Go Back <span class="arr">ยป</span>
</div>
The code also checks if the page is valide before disabling the button, so that if it is not valid, the user can click it again. This is why I did it this way.
Is there a solution to solve this? thanks
LATER EDIT: one thing that solved it is that I took off the UpdatePanel. The whole page was in an update panel. But this shouldn't be the solution to this.
You don't need last 3 lines if you have added OnClick server side event.
You can do simply with the help of this javascript function:
function CheckEmptyFields(){
document.getElementById('<%=btnSave.ClientID %>').disabled = "disabled";
document.getElementById('<%=btnSave.ClientID %>').value = "Please wait...";
<%= ClientScript.GetPostBackEventReference(btnSave, "") %>;
}
And add this in your button
OnClientClick="CheckEmptyFields();"
so, now your button should be:
<asp:Button Text="Submit" id="btnSave" runat="server" style="margin-left: 112px;"
onclick="btnSave_Click" OnClientClick="CheckEmptyFields();" class="ui-button ui-widget ui-state-default ui-corner-all" />

Categories

Resources