locked
Design methods for more than one buttons in a view page RRS feed

  • Question

  • User417201021 posted

    Hi,

    Please donot mind, i am new to MVC so i keep asking silly questions.

    I have 2 Buttons and 1 Dropdownlistfor on my page

    Button1 for searching the employee

    Button2 for submitting the new employee

    and Dropdownlistfor with the employee names

    i have a [HTTP POST] Index action method. This action method gets invoked for all of them Button1, Button2 and Dropdownlistfor. i want to invoke this Index action method only when i select employee name in my Dropdownlistfor.

    Also let me know, how can i create and invoke separate methods for Button1 and Button2, as the usage for both the buttons would vary from each other.

    Thank you.

    Friday, November 30, 2018 4:38 PM

All replies

  • User-474980206 posted

    first you should learn html form posting, so you know how to code in MVC.

    in a browser, when a submit button is clicked, a form post is done. if the button has a name and a value, then this name/value pair will be added to the post field. if it and image button, two new name/value pairs for the x and y will be added (name_x and name_y).

    in a browser, the form specifies the post back url. more than 1 form is allowed, but they can not be nested (one inside another)

    if the buttons are in the same form you have a couple options:

    1) give them the same names (say "PostButton") and different value, so the post back action can tell which button is clicked

    public ActionResult MyPost (MyModel model, string PostButton)
    {
        if (PostButton == "submit") return MyPostSubmit(model);
        if (PostButton == "search") return MyPostSearch(model);
        return View(model);
    }
    
    private ActionResult MyPostSearch (MyModel model)
    {
    }
    
    private ActionResult MyPostSubmit (MyModel model)
    {
    }
    

    2) use javascript to change the form action url to the desired posture on click

    3) use ajax instead of a form post.

    Friday, November 30, 2018 7:26 PM
  • User1520731567 posted

    Hi Jimmit_05,

    GET is used for viewing something, without changing it, while POST is used for changing something.

    For example, a search page should use GET, while a form that changes your password should use POST.

    Generally,if you have behavior that affects the database,such as:Creates, Updates, and Deletes (data modification),you need to use HttpPost.

    You could use HttpGet to Button1 and Dropdownlistfor.

    For example:

    You have a Button2 which submitting the new employee,it needs to add a new record to database,

    This button is suitable for using HttpPost,like

    Create View:

    @using (Html.BeginForm()) 
    {
        ...
    
        <div class="form-group">
            @Html.LabelFor(model => model.Title, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.Title, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.Title, "", new { @class = "text-danger" })
            </div>
        </div>
    
        <div class="form-group">
            @Html.LabelFor(model => model.Publisher, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.Publisher, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.Publisher, "", new { @class = "text-danger" })
            </div>
        </div>
    
        ...
    
        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="Button2" class="btn btn-default" /> //it will jump to httppost Create Action
            </div>
        </div>
    </div>
    }

    Controller:

     public ActionResult Create()
            {
                ...
                return View();
            }
    
            // To protect from overposting attacks, please enable the specific properties you want to bind to, for 
            // more details see https://go.microsoft.com/fwlink/?LinkId=317598.
            [HttpPost]
            [ValidateAntiForgeryToken]
            public ActionResult Create([Bind(Include = "Id,Title,Publisher,Author_id")] book book)
            {
    
              ...
                if (ModelState.IsValid)
                {
                    db.book2s.Add(book);
                    db.SaveChanges();
                    return RedirectToAction("Index");
                }
    
              ...
                return View(book);
            }

    You could use onclick() and ajax() to separate methods,for example:

     <input type="button" value="Button1 " onclick="doSearch()" />
            function doSearch() {
                $.ajax({
                    url: '/ControllerName/ActionName',
                    type: 'GET',
                   // data: { id: xxx },//If you need to pass parameters
                    success: function (data) {
                     ...
    
                    }
                })
            }

    Controller:

     public ActionResult ActionName(/*int id*/)
    {
    ... }

    And you could also add onclick event and ajax to Dropdownlistfor.


    Or,you could add multiple forms with post and get action,without ajax:

    @using (Html.BeginForm("Search", "Home", FormMethod.Get, new {})) {}
    
    ...
    
    @using (Html.BeginForm("Create", "Home", FormMethod.Post, new {})) {}

    Like this link:

    https://www.aspsnippets.com/Articles/Multiple-Forms-in-Same-Page-View-in-ASPNet-MVC.aspx

    https://stackoverflow.com/questions/15788806/asp-net-mvc-4-multiple-post-via-different-forms

    Best Regards.

    Yuki Tao

    Monday, December 3, 2018 9:03 AM