CODEWITHSUNDEEP
asp.net-mvcroutesasp.net-mvc-routing
adnan
adnan

Reputation: 1459

how to make custom URL with custom routing in MVC

I have problem to make custom url in mvc. I want to make url like this one:

http://www.domainname.com/directory/bysearch/value1/value2

but its make like this

http://www.domainname.com/directory/bysearch?txtaddress=value1&searchString=value2

and

RouteConfig.cs code

routes.MapRoute(
           name: "Directory",
           url: "Directory/{qualifier}/{v1}/{v2}/{v3}/{v4}/{v5}/{v6}/{v7}/{v8}",
           defaults: new
           {
               controller = "Directory",
               action = "index",
               qualifier = UrlParameter.Optional,
               v1 = UrlParameter.Optional,
               v2 = UrlParameter.Optional,
               v3 = UrlParameter.Optional,
               v4 = UrlParameter.Optional,
               v5 = UrlParameter.Optional,
               v6 = UrlParameter.Optional,
               v7 = UrlParameter.Optional,
               v8 = UrlParameter.Optional
           });
routes.MapRoute(
    name: "DirectorySerach",
    url: "Directory/bysearch/{v1}/{v2}",
    defaults: new
    {
        controller = "Directory",
        action = "Search",
        v1 = UrlParameter.Optional,
        v2 = UrlParameter.Optional
    });

Controller

public ActionResult Index(string qualifier, string v1, string v2, string v3, string v4, string v5, string v6, string searchString, int page = 1)
    {
       // code logic here
       return View();
    }
public ActionResult Search(string v1 = null,string v2 = null)
{
   //code logic here
    return View();
}

View

@using (Html.BeginForm("search","Directory", FormMethod.Get))
{
    <div class="form-group">
        <div class="c-checkbox">
            <input id="chkOnline" name="chkOnline" class="c-check" type="checkbox">
            <label for="chkOnline" class="c-font-thin c-font-17">
                <span></span>
                <span class="box"></span> Online
                <span class="check"></span>
            </label>
        </div>
    </div>
    <div class="form-group">
       @Html.TextBox("txtaddress", null, new { @class = "form-control c-square c-theme input-lg", @placeholder = "Address OR ZIP/Postal Code OR City" })
    </div>
    <div class="input-group input-group-lg c-square">
        @Html.TextBox("searchString", null, new { @class = "form-control c-square c-theme input-lg", @placeholder = "Enter Keyword" })
        <span class="input-group-btn">
            <button class="btn c-theme-btn c-btn-square c-btn-uppercase c-font-bold" type="submit">Go!</button>
        </span>
    </div>
}

please help/guide me, where i am wrong or what is the problem. and how to resolve. i appreciate your value able time and effort. thanks in advance.

Upvotes: 0

Views: 477

Answers (1)

Amit Kumar
Amit Kumar

Reputation: 5962

If you want to make clean URl then you need to craete URl manually, As Form Submit will always create query string.

So remove your form and replace button with hyperlink. and write click event on link.

@Html.TextBox("v1", null, new {  })
@Html.TextBox("v2", null, new {  })
<a href="javascript:void(0)" id="btnSearch" class="btn btn-primary">GO</a>

Now Write a function which will create URl 

<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function(){
    $('#btnSearch').on('click',function(){
    var baseUrl = '@Url.Action("Search", "Directory")'; 
    var gettext1= $('#v1').val();
      var gettext2= $('#v2').val();
       if(gettext1){
        baseUrl  += '/'+gettext1;
       }else{
        baseUrl  += "/0";
      }
      if(gettext2){
        baseUrl  +="/"+ gettext2;
       }else{
        baseUrl  += "/0";
      }
    location.href=baseUrl;
    });
});
</script>

here you need to handle 0. as if user doesn't enter anything in textbox then I'm passing 0.

Upvotes: 1

Related Questions