Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>From <a href="http://www.senseiclassroom.net/lesson.asp?id=141" rel="nofollow">my website</a>:</p> <p>Now, Ajax.ActionLink is really useful, and the Confirm AjaxOption is even more...still, who wants those crappy Javascript Alert these days? I am developing an application with Ms MVC 2 and I'm using the fantastic JQueryUI library to customize the visuals of all my elements. One of the best things JQueryUI has, are dialog windows...those like "Are you sure to delete this file? Yes/No"... and I WANT TO USE THEM IN MY Ajax.ActionLink!</p> <p>Since i didn't find an answer on the net, I looked for a simple way to do it...and now I post it here.</p> <p>First: read and implement on your page the nice tutorial written by Ricardo Covo: "ASP MVC Delete confirmation with Ajax &amp; jQuery UI Dialog" (Just google it)</p> <p>I made simple changes to his Javascript code, simply using remove() instead of hide('fast') and applying a class "item" to the tr to delete.</p> <pre><code>deleteLinkObj.closest("tr").hide('fast') </code></pre> <p>becomes</p> <pre><code>deleteLinkObj.closest("tr.item").remove(); </code></pre> <p>Now, after you followed the previous tutorial, you are ready to substitute the </p> <pre><code>&lt;%: Html.ActionLink([LinkName],[ActionName], new { id = item.Id }, new { @class = "delete-link" })%&gt; </code></pre> <p>row with</p> <pre><code>&lt;%:Ajax.ActionLink([LinkName],[ActionName],[ControllerName],new { id = item.Id },new AjaxOptions{HttpMethod = "Delete" /*You can use Post though*/,OnBegin = "JsonDeleteFile_OnBegin" /*This is the main point!*/}, new { @class = "delete-link" } ) %&gt; </code></pre> <p>You can use the Post method if you like to, the important thing here is the OnBegin option, that calls a javascript that prevents the server action to be called before JQueryUI Dialog Confirmation:</p> <pre><code>&lt;script language="javascript"&gt;function JsonDeleteFile_OnBegin(context) {return false;/*Prevent the Ajax.Action to fire before needed*/}&lt;/script&gt; </code></pre> <p>Place the javascript on the page.</p> <p>So, now what will happens: When you click on the Delete button, it will open the JQueryUI whilst calling the OnBegin function (that cancel the normal post action). In case of "Confirm", Ricardo Covo's code will fire the server side action, and in the Ricardo Covo's javascript code of Confirmation you'll be able to execute all the actions in case of Success (like hiding the row delete).</p> <p><strong>Pay Attention</strong>: With this method, you must manage function for success/fail in the javascript code of Ricardo Covo, since the OnSuccess and OnComplete AjaxOptions will not be fired at all (probably overwritten by some code).</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload