Passing value from view to a controller

Question

I have this helper code

@helper GetTreeView(List<MvcTreeview.Models.Category> siteMenu, int     parentID)
{
foreach (var i in siteMenu.Where(a => a.ParentID.Equals(parentID)))
{
    <li>
        @{var submenu = siteMenu.Where(a => a.ParentID.Equals(i.ID)).Count();}
        @if (submenu > 0)
        {
            <span class="collapse collapsible">&nbsp;</span>
        }
        else
        {
            <span style="width:15px; display:inline-block">&nbsp;</span>
        }
        <span id="Category">
            <a href="#" id="@i.ID">@i.CategoryName</a>
            <b></b>
        </span>
        @if (submenu > 0)
        {
            <ul>
                @Treeview.GetTreeView(siteMenu, i.ID)
                @* Recursive  Call for Populate Sub items here*@
            </ul>
        }
    </li>
}
}

and i want to pass the id to a Action method of a controller. How to pass the id from view to a action method in controller.

$('#Category').click(function () {

    url = '@Url.Action("Index", "TestDetails");
    $.ajax({
        url: url,
        type: 'POST',
        success: function (returnData) {

        },
        error: {
        }
    });
});

How can i get the id in the second snippet of code.

Using that id i have to fetch some details using a action method in my controller.

Action Method

public ActionResult Index(int id)
{
    TestDetail detail = new TestDetail();
    detail = db.TestDetails.Single(a => a.ID == id);


    return View(detail);
}

Possible duplicate of [Passing parameters in ajax call](http://stackoverflow.com/questions/18697034/how-to-pass-parameters-in-ajax-post) — Mivaweb, May 26 '15 at 06:58
no it is not i have id in my hepler which is needed to passed using ajax from the view. i am not going to hard code anything. — SHIVANG RANA, May 26 '15 at 06:59
@AntonPutau i told you that i have to pass aid which is different for each click i can't hard code anything. — SHIVANG RANA, May 26 '15 at 07:04
`id` attributes must be unique! You have multiple elements with `id="category"`. Use class names and store values in `data` attributes — , May 26 '15 at 07:04
@StephenMuecke i did that but i am asking how to pass that from helper to ajax call in view. — SHIVANG RANA, May 26 '15 at 07:05
if you mean pass to javascript from razor - data : { id : "@Model.Id" } — Anton Putau, May 26 '15 at 07:05
pass from ajax call means you need to add data parametr to ajax. If not your question is unclear. — Anton Putau, May 26 '15 at 07:10

Abbas Galiyakotwala · Accepted Answer · 2015-05-28T05:07:02.897

2

simply pass "this" to your onclick function

<span class="Category">
            <a href="#" id="@i.ID" onClick="CategoryClick(this.id)">@i.CategoryName</a>
            <b></b>
</span>

Javascript: (Edited)

<script type="text/javascript">
    function CategoryClick(clicked_id)
    {
        alert(clicked_id);
        url = '@Url.Action("TestDetails", "Index")'; //Url.Action(actionName, ControllerName)
        $.ajax({
            url: url,
            data: {id: clicked_id}, //json format
            success: function (returnData) {

            },
            error: {
            }
        });
    }
</script>

edited May 28 '15 at 05:07

answered May 26 '15 at 08:33

Abbas Galiyakotwala

2,949
4
19
34

BY using your code i am able to get the id in clicked_id, but i am not able to hit the url. – SHIVANG RANA May 27 '15 at 09:23
Answer Edited have a check – Abbas Galiyakotwala May 27 '15 at 09:37
hey can you please tell me that how to return a view from ajax as in my action method i have data in model now i want to put in the view but i am not getting how to do it.. – SHIVANG RANA May 28 '15 at 06:04
on ajax success call return a partial view having data model and update your div tag.. success: function (data) { $('#yourdiv').html(data);} – Abbas Galiyakotwala May 28 '15 at 10:32
now i want to add right click functionalities here in span class=category. how can i do that? – SHIVANG RANA May 28 '15 at 11:29
check this http://stackoverflow.com/questions/1206203/how-to-distinguish-between-left-and-right-mouse-click-with-jquery – Abbas Galiyakotwala May 28 '15 at 12:02
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/79008/discussion-between-abbas-galiyakot-and-shivang-rana). – Abbas Galiyakotwala May 28 '15 at 12:49

Ala · Answer 2 · 2015-05-26T09:59:08.190

1

Edit your helper as following:

@helper GetTreeView(List<MvcTreeview.Models.Category> siteMenu, int     parentID)
{
foreach (var i in siteMenu.Where(a => a.ParentID.Equals(parentID)))
{
    <li>
        @{var submenu = siteMenu.Where(a => a.ParentID.Equals(i.ID)).Count();}
        @if (submenu > 0)
        {
            <span class="collapse collapsible">&nbsp;</span>
        }
        else
        {
            <span style="width:15px; display:inline-block">&nbsp;</span>
        }
        <span >
            <a class="Category" href="#" id="@i.ID">@i.CategoryName</a>
            <b></b>
        </span>
        @if (submenu > 0)
        {
            <ul>
                @Treeview.GetTreeView(siteMenu, i.ID)
                @* Recursive  Call for Populate Sub items here*@
            </ul>
        }
    </li>
}
}

and the ajax call:

$('.Category').click(function () {

        url = '@Url.Action("Index", "TestDetails")';
        $.ajax({
            url: url,
            type: 'POST',
            data: "{'id': " + $(this).attr("id") + "}",
            success: function (returnData) {

            },
            error: {
            }
        });
    });

edited May 26 '15 at 09:59

answered May 26 '15 at 08:23

Ala

1,505
1
20
36

Have you edited your action method (Index) to accept a parameter called (id)? please put the code of your action method – Ala May 26 '15 at 09:19
i have put Action method in th question. – SHIVANG RANA May 26 '15 at 09:36
Is there any error in the console window in the developer tools when you click the category item? also note that you have a missing ' at the end of this line: url = '@Url.Action("Index", "TestDetails")'; – Ala May 26 '15 at 09:57
Did you debug if the (click) event is called using the developer tools? try to replace the ajax call in the click function with this line: alert("click!"); – Ala May 26 '15 at 13:36

Passing value from view to a controller

2 Answers2