Modal dialogue box in MVC

Question

1.00/5 (1 vote)

See more:

Hi can someone help me in assigning javascript variable contact_person_id to load('@Html.Raw(Url.Action When i assign (contact_person_id = contact_person_id) as parameter i am getting error, my full code is below var contact_person_id = (response.contact_person_id); $('#dialog').load('@Html.Raw(Url.Action("AddUserPartialView_Applicant", "CreateApplicationFromSearch", new { Applicant_id = Model.applicant_id,
Application_id = ViewBag.Application_id, CameFrom="Applicant", contact_person_id = contact_person_id }))'

$('#btnSaveClose').click(function () {
$(function () {
$('#dialog').dialog({
autoOpen: false,
width: 400,
resizable: false,
title: 'Confirm Email',
modal: false
});
var form = $('#ApplicantForm');

try {
$.ajax({
cache: false,
async: true,
type: "POST",
url: "/CreateApplicationFromSearch/SaveAndCloseApplicant",
data: form.serialize(),
success: function (response) {
if (response != null && response.success) {
var contact_person_id = (response.contact_person_id);
$('#dialog').load('@Html.Raw(Url.Action("AddUserPartialView_Applicant", "CreateApplicationFromSearch",
new { Applicant_id = Model.applicant_id,
Application_id = ViewBag.Application_id,
CameFrom="Applicant", contact_person_id = contact_person_id }))'
function (response, status, xhr) {
$('#dialog').dialog('open');
$(".ui-dialog-titlebar-close").hide();
});
} else {
alert(response.responseText);
}
},
error: function (response) {
alert("error!" + response.responseText);
}
});

What I have tried:

tried using Url.Action instead of raw(Url.Action

Posted 18-Apr-17 23:35pm

Member 12697982

Updated 19-Apr-17 1:26am

Add a Solution

Comments

Richard MacCutchan 19-Apr-17 5:38am

"i am getting error"
Then please tell us what it is and where it occurs.

2 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

NightWizzard · Answer 1 · 2017-04-19T01:03:00

You may use the modal dialogs of Bootstrap - see description here:
Bootstrap JS Modal Reference[^]

Or you can build your own simple dialogs by setting some session properties in the controller's action method which requires the message like this:

HTML

Session.Add("MessageBox", "This is my message text");
Session.Add("MessageBoxWidth", "300px");
Session.Add("MessageBoxHeight", "130px");

In the action method that displays the next view (may be the same as before) translate the session properties to viebag like this:

HTML

if(Session["MessageBox"] != null)
{
    ViewBag.MessageBox = Session["MessageBox"];
    ViewBag.MessageBoxWidth = Session["MessageBoxWidth"];
    ViewBag.MessageBoxHeight = Session["MessageBoxHeight"];
   Session.Remove("MessageBox");
}

Note that the session property is removed to show the messae only once!
In your shared layout add the following lines:

HTML

@if (ViewBag.MessageBox != null)
{
    <div id="MessageBox" style="width:@ViewBag.MessageBoxWidth;height:@ViewBag.MessageBoxHeight;" class="messagebox">
    <br />
    @ViewBag.MessageBox
    <br />
    <br />
    <input type="image" src="@Url.Content("~/Content/Images/ok_32.png")" title="OK" onclick="hideMessageBox();" class="btn btn-default" />
    </div>

    <script type="text/javascript">
    function hideMessageBox() {
        document.getElementById('MessageBox').style.visibility = 'hidden';
        }
    </script>
}

...and replace the 'OK_32.png' by your own image for 'OK' or replace the img tag with the simple text 'OK'.
That's it!

F-ES Sitecore · Answer 2 · 2017-04-19T01:26:00

You need to understand how MVC works and how views are rendered. Your server-code runs first (anything in a @{ } block) and the resulting html is sent to the browser to execute. So in this line

$('#dialog').load('@Html.Raw(Url.Action("AddUserPartialView_Applicant", "CreateApplicationFromSearch", 
new { Applicant_id = Model.applicant_id, 
Application_id = ViewBag.Application_id, 
CameFrom="Applicant", contact_person_id = contact_person_id }))'

Url.Action runs on the server however "contact_person_id" is not defined anywhere in your server code. It is defined as a js variable but that variable only exists after your server code has run and the results given to the browser so you can't access it in your server code. And even then it would be meaningless as it would have no value anyway.

If you want to add js variables to your urls then do something like

JavaScript

'@Url.Action("MyAction", "MyController")?p1=' + jsVar1 + '&p2=' + jsVar2

Modal dialogue box in MVC

2 solutions

Solution 1

Solution 2

Add your solution here

Preview 0