Note that there are some explanatory texts on larger screens.

plurals
  1. POImplementing a simple product dropdown in ASP.NET MVC
    text
    copied!<p>What are the different or best ways I can implement a simple product dropdown in ASP.NET MVC, that redirect the user to a new product when they pick from the dropdown ?</p> <p>I have currently have my primary mapping rule :</p> <pre><code> routes.MapRoute( "Product", "Products/{sku}", new { controller = "Products", action = "ViewProduct", sku = "1001" } ); </code></pre> <p>This allows me to enter a URL like this to view my product:</p> <pre><code>/Products/1002 </code></pre> <p>I have a dropdown on my page which represents a list of products, and allows you to select form the list. (The <code>sku</code> parameter is the same name as the parameter in my controller's ViewProduct method) :</p> <pre><code>&lt;% using (Html.BeginForm("ViewProduct", "Products")) { %&gt; &lt;%= Html.DropDownList("sku", ViewData.Model.ProductsList)%&gt; &lt;%= Html.SubmitButton() %&gt; &lt;!-- just using a button now since its easier --&gt; &lt;% } %&gt; </code></pre> <p>This form targets the 'ViewProduct' command that I have in my controller (which is a full view that renders a product's information page).</p> <p>The problem is that the HTML generated (when I view the HTML for <code>/Products/1002</code>) looks like this:</p> <pre><code>&lt;form action="/Products/1002" method="post"&gt; &lt;select id="sku" name="sku"&gt; &lt;option value="1003"&gt;Product 1003&lt;/option&gt; &lt;option value="1002"&gt;Product 1002&lt;/option&gt; &lt;option value="2001"&gt;Product 2001&lt;/option&gt; &lt;/select&gt; &lt;input type="submit" /&gt; &lt;/form&gt; </code></pre> <p>It has gone and created the action link based upon the <strong>current</strong> URL (i guess it really had no choice). The problem is that when my controller is called after clicking 'Submit' it just goes ahead and fetches product 1002 again - and doesnt get overridden by the 'sku' parameter from the form.</p> <p>Now, the actual value is available in <code>Request.Params["sku"]</code>, but obvously its a pretty horrible practice to go and try to get it from there.</p> <p>One extremely convoluted solution is as follows - create a different routing rule which hits a different controller method <code>RedirectProduct</code>.</p> <pre><code>routes.MapRoute( "Product Redirect", "Products/RedirectProduct", new { controller = "Products", action = "RedirectProduct" } ); </code></pre> <p>Then the action to my form can simply be :</p> <pre><code>&lt;% using (Html.BeginForm("RedirectProduct", "Products")) { %&gt; </code></pre> <p>This hits my controller method, which has access to 'sku' (the correct one I want that is coming from the form params). The controller method just redirects to /Products/XXX .</p> <pre><code>public ActionResult RedirectProduct(string sku) { return new RedirectResult("/Products/" + sku); } </code></pre> <p>I don't like this solution at all - but I wanted to at least present what I had so far. I dont like adding extra mapping rules like this, and having to create different action names when I really just have one.</p> <p>I'm sure theres 50 different ways I could do this -- hence me asking the question on stackoverflow -- to try and figure which is best. Unfortunately at this time the documentation for Forms handling for MVC that I've found is pretty simple.</p> <p>PS. I'm not primarily looking for a JQuery solution (I want to master 'pure MVC' first) but I'd welcome one.</p>
 

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