Custom button from jquery dialog not calling controller action - c#

I have main view and open a dialog by using the jquery dialog like below.
function ShowDialog() {
dialog = $('#reassign').dialog({
autoOpen: false,
height: 500,
width: 700,
modal: true,
open: function () {
$('#reassign').load('/ItemsList/Reassign');
}
});
dialog.dialog("open");
}
The content of the dialog is in a PartialView. I have a button on that dialog and I want to call another action to load a list of users. This how I call the action method. But its not getting fired.
$('#searchUser').click(function () {
var search = $('#search').val();
alert(search);
$.ajax({
ur1: '#(Url.Action("Users", "WorkItemsList"))',
type: 'POST',
success: function(result) {
alert(result);
}
});
});
Am I missing something?

Related

from contact form to sendemail MVC5

Im having some contact form and I have in a HomeController method SendMessage, also in my form I have hidden success and error div.
How to call sendmessage, but to stay on the same page?
As commented by Igor, use an ajax call to hit your controller/method.
Here is an example -
<script>
$(function () {
$('#sendMail').click(function () {
$("#sendMail").empty();
$("#sendMail").attr("disabled", true);
$("#sendMail").append('<i class="fa fa-spinner fa-spin"></i>Please wait...');
$.ajax
({
url: '#Url.Action("SendMail", "ControllerName")',
type: 'POST',
datatype: 'application/json',
contentType: 'application/json',
data: JSON.stringify({ 'name': $('#txtName').val(), 'email': $('#txtEmail').val(), 'message': $('#txtMessage').val() }),
success: function (result) {
$("#sendMail").empty();
$("#sendMail").append('Send Message');
$("#sendMail").attr("disabled", false);
},
error: function (result) {
$("#sendMail").empty();
$("#sendMail").append('Send Message');
$("#sendMail").attr("disabled", false);
}
});
})
})
</script>
In above javascript function -
When user clicks on button with text 'Send Mail' and id = sendMail, I disabled the button so the user won't click it multiple times and change the text of button to 'Please wait' and add a spinner for dramatic effect. I also send email of the user and name and message with the ajax call. On ajax success, I show a toaster with success message and remove the spinner and please wait text from the button and set 'Send Mail' text again.
I removed toaster javascript part in case you want to use other notification method. Good luck.

Bootstrap Modal popup not showing up first time

While I first click this #btnRequestedProviderSelect button, bootstrap modal is not showing popup. But I second click it will come why?
$("#btnRequestedProviderSelect").click(function () {
$("#hdnORProvider").val('Requested');
$.ajax({
type: "Get",
async: false,
url: settings.ProviderSearchPopupURL,
data: {
coverageID: 0,
fromPage: settings.Frompage, HPID: $('#MemberHealthPlanID').val(),
LOBID: $("#MemberLOBID").val(), IPAID: $("#MemberIPAID").val()
},
success: function (data) {
$("#divProviderSearch").html(data);
$("#divProviderSearchPopup").modal();
$('#divProviderSearchPopup').modal({
keyboard: false
});
$('#divProviderSearchPopup').modal('show');
}
});
});
<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>

set buffer false during jQuery ajaxSubmit

I want to run ASPX page in ASP page.
So I use ajaxSubmit and print to "target div" get from ASPX page like this:
var data = new FormData();
data.append("email", $("#EMAIL").val());
data.append("pass", $("#PASS").val());
data.append("store", $("#STORE").val());
if ($("#STORE").val()!="" && $("#EMAIL").val()!="" && $("#PASS").val()!="") {
e.preventDefault();
$(this).ajaxSubmit({
data: $(this).serialize(),
target: "#formres",
async: true,
global: false,
cache: false,
beforeSubmit: function () {
},
success: function () {
if($("#yu").val()!="yes")
{
setTimeout(function(){
window.location.href = $("#yu").val();
},2000);
}
},
resetForm: false
});
But anything display before process ends.
I think it must be something like "Response.Buffer=false" or "flush()" at jquery too.(I use "cache: false," for this purpose)
I set Reponse.Buffer =false at asp and aspx page.
But it still not working. Could anyone help me?

Fancybox doesn't work after a success of an ajax call

Why is not working fancybox after check validation in c#?
fancybox is call after use PageMethods.ValidacionIsAdmin(onSuccessValidacionIsAdmin); if it is valid the return of database executed in:
[WebMethod]
public static DeleteAccountResult ValidacionIsAdmin()
{
DeleteAccountResult res = new DeleteAccountResult();
... // Query to database with ok results
res.ok = true;
return res;
}
The ajax call in client to validate it is:
jQuery(".delete a").click(function () {
function onSuccessValidacionIsAdmin(data) {
if (data.ok == true) {
jQuery("#<%= divError.ClientID %>").hide();
jQuery(".delete a").fancybox({
content: jQuery('#eliminar-cuenta').html(),
modal: false,
showCloseButton: false,
onComplete: function () {
jQuery("input[type=checkbox]").uniform()
jQuery('#privacidad').fancybox({
enableEscapeButton: false,
hideOnOverlayClick: false,
showCloseButton: true,
onComplete: function () {
jQuery('#fancybox-close').off().on('click', function (e) {
e.preventDefault();
jQuery(".delete a").click();
});
}
});
}
});
}
else {
jQuery("#<%= divError.ClientID %>").show();
jQuery("#lblError")[0].innerHTML = data.strError;
}
}
PageMethods.ValidacionIsAdmin(onSuccessValidacionIsAdmin);
});
The Behaviour is look like after to push the link which open fancybox don't open it, looks like it "refresh" the web and I push the same link and then it is working...
I readed fancy doesn't work after an ajax call (in my case the c# validation)
My question is: why it happens?
After some hours of investigation, I got the solution. It is curious, in all propierties ineas to write content: ... I replaced as: 'content': ...
I added the property 'type':'html'
After do that the fancybox was working.
jQuery(".delete a").fancybox({
'content': jQuery('#eliminar-cuenta').html(),
'type': 'html',
'modal': false,
'showCloseButton': false,
'onComplete': function () {
jQuery("input[type=checkbox]").uniform()
jQuery('#privacidad').fancybox({
enableEscapeButton: false,
hideOnOverlayClick: false,
showCloseButton: true,
onComplete: function () {
jQuery('#fancybox-close').off().on('click', function (e) {
e.preventDefault();
jQuery(".delete a").click();
});
}
});
}
});

RegisterClientScriptBlock In userControl

This is my jquery and javascript code :
<script type="text/javascript">
$(document).ready(function () {
//setup new person dialog
$('#dialog').dialog({
modal: true,
modal: true,
// show: "clip",
// hide: "explode",
autoOpen: false,
title: "انتخاب فاکتور",
open: function (type, data) {
$(this).parent().appendTo("form");
}
});
//setup edit person dialog
$('#editPerson').dialog({
autoOpen: false,
draggable: true,
title: "Edit Person",
open: function (type, data) {
$(this).parent().appendTo("form");
}
});
});
function showDialog(id) {
$('#' + id).dialog("open");
}
function closeDialog(id) {
$('#' + id).dialog("close");
}
The Code Is in UserControl .
i can show Dialog client Side :
and i can register code from server with this code :
Page.ClientScript.RegisterClientScriptBlock(GetType(String), "script", "$(function() {showDialog('dialog');});", True)
this code works in page but not in user control.
how can i fix it?
HTML Code :
'>
' runat="server" />
Not sure whether this is the issue or not. Since UserCOntrol is a naming container your element id might have changed. So you need to get the id using ClientID.
Change your code to something like this
$("#<%=yourbuttonid.ClientID%>").dialog("open");
Check the rendered HTML code of your page. Is the order of your script blocks correct? The setup block should be first there, and the showDialog call block should be rendered somewhere below it. Is it your case?

Categories