How To get Selected Radio Button Value in Mvc

Miranda

I am trying to create a simple rating system in MVC just for learning. My problem is that I am not able to get the radio button selected value I am trying to pass it to the controller. Any help will be appreciated.

Here is my code:

@model WebApplication1.ViewModel.ViewModelRatingAndReviews
<script src="~/Scripts/jquery-1.10.2.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $("#btn-gn").click(function () {
            var RatingStar = $("input[name=star]:checked").val()
            $.ajax({
                url: '@Url.Action("GiveReview", "ProvideReview")',
                type: 'GET',
                data: {"RatingStar": RatingStar },
                success: function (result) {
                    //alert("success");
                    console.log("click");
                },
                error: function (result) {
                    alert("error!");
                }
            });   //end ajax
        });
    });
</script>
@using (Html.BeginForm("GiveReview", "ProvideReview", FormMethod.Post, new { Id = "ratingsForm" }))
{
    @Html.AntiForgeryToken()
    <div class="wrapper">
        <div class="container">
            <div class="mid-content">
                @* Header Title Starts *@
                <div class="row">
                    <div class="col-md-12">
                        <div class="title-head">
                            <h3><span class="mid-content-head">Provide Ratings</span></h3>
                        </div>
                    </div>
                </div>
                @* Header Title Ends *@
            </div>
                <div class="row">
                    <div class="col-md-12">
                        <div class="l-search">
                            @* For UID *@
                            <div class="row">
                                <div class="col-md-3">
                                    <span class="profile-name">UserId</span>
                                </div>
                                <div class="col-md-3">
                                    @Html.TextBox("UserId")
                                </div>
                            </div><br />
                            @* UID Ends *@
                            <div class="row">
                                <div class="col-md-3">
                                    <span class="profile-name"> Select Your Ratings</span>
                                </div>
                                <div class="col-md-2">
                                    <div class="stars">
                                        <input type="radio" name="star" class="star-1" id="star-1" value="1"/>
                                        <label class="star-1" for="star-1">1</label>
                                        <input type="radio" name="star" class="star-2" id="star-2" value="2"/>
                                        <label class="star-2" for="star-2">2</label>
                                        <input type="radio" name="star" class="star-3" id="star-3" value="3"/>
                                        <label class="star-3" for="star-3">3</label>
                                        <input type="radio" name="star" class="star-4" id="star-4" value="4"/>
                                        <label class="star-4" for="star-4">4</label>
                                        <input type="radio" name="star" class="star-5" id="star-5" value="5"/>
                                        <label class="star-5" for="star-5">5</label>
                                        <span></span>
                                    </div>
                                </div>
                            </div><br />


                            @* For Consumer Name *@
                            <div class="row">
                                <div class="col-md-3">
                                    <span class="profile-name">Consumer Name</span>
                                </div>
                                <div class="col-md-3">
                                    @Html.TextBox("Consumername")
                                </div>
                            </div><br />
                            @* Consumer Name Ends *@

                            @* For Review Header *@
                            <div class="row">
                                <div class="col-md-3">
                                    <span class="profile-name">Enter Review Subject</span>
                                </div>
                                <div class="col-md-3">
                                    @Html.TextBox("Consumername")
                                </div>
                            </div><br />
                            @* Review Header Ends *@

                            @* For Review Header *@
                            <div class="row">
                                <div class="col-md-3">
                                    <span class="profile-name">Enter Review Content</span>
                                </div>
                                <div class="col-md-3">
                                    @Html.TextArea("ReviewContent")
                                </div>
                            </div><br />
                            @* Review Header Ends *@


                        </div>
                    </div>
                </div>
           @* Button Area Starts*@
            <div class="lender-search">
                <button type="submit" id="btn-gn">Submit</button>
                <button type="reset">Clear</button>
            </div>
            @* Button Area Ends *@
        </div>
        </div>
        }

Controller

public ActionResult GiveReview()
{
    ViewModelRatingAndReviews viewModelRatingAndReviews = new ViewModelRatingAndReviews();
    return View(viewModelRatingAndReviews);
}

[HttpPost]
public ActionResult GiveReview(int UserId, int RatingStar, string ConsumerName, string ReviewHeader, string ReviewContent)
{
    ViewModelRatingAndReviews viewModelRatingAndReviews = new ViewModelRatingAndReviews();
    viewModelRatingAndReviews.InsertRating(UserId, RatingStar, ConsumerName, ReviewHeader, ReviewContent);
    return View("SubmittedReview",viewModelRatingAndReviews);
}
Ram Khumana
  1. Without jquery:

View:

@model Model.RatingAndReviews

@using (Html.BeginForm("GiveReview", "Home", FormMethod.Post, new { Id = "ratingsForm" }))
{
    @Html.AntiForgeryToken()
    <div class="wrapper">
        <div class="container">
            <div class="mid-content">
                @* Header Title Starts *@
                <div class="row">
                    <div class="col-md-12">
                        <div class="title-head">
                            <h3><span class="mid-content-head">Provide Ratings</span></h3>
                        </div>
                    </div>
                </div>
                @* Header Title Ends *@
            </div>
            <div class="row">
                <div class="col-md-12">
                    <div class="l-search">
                        @* For UID *@
                        <div class="row">
                            <div class="col-md-3">
                                <span class="profile-name">UserId</span>
                            </div>
                            <div class="col-md-3">
                                @Html.TextBoxFor(m => m.UserId)
                            </div>
                        </div><br />
                        @* UID Ends *@
                        <div class="row">
                            <div class="col-md-3">
                                <span class="profile-name"> Select Your Ratings</span>
                            </div>
                            <div class="col-md-2">
                                <div class="stars">
                                    <input type="radio" name="RatingStar" class="star-1" id="star-1" value="1" />
                                    <label class="star-1" for="star-1">1</label>
                                    <input type="radio" name="RatingStar" class="star-2" id="star-2" value="2" />
                                    <label class="star-2" for="star-2">2</label>
                                    <input type="radio" name="RatingStar" class="star-3" id="star-3" value="3" />
                                    <label class="star-3" for="star-3">3</label>
                                    <input type="radio" name="RatingStar" class="star-4" id="star-4" value="4" />
                                    <label class="star-4" for="star-4">4</label>
                                    <input type="radio" name="RatingStar" class="star-5" id="star-5" value="5" />
                                    <label class="star-5" for="star-5">5</label>
                                    <span></span>
                                </div>
                            </div>
                        </div><br />


                        @* For Consumer Name *@
                        <div class="row">
                            <div class="col-md-3">
                                <span class="profile-name">Consumer Name</span>
                            </div>
                            <div class="col-md-3">
                                @Html.TextBoxFor(m => m.ConsumerName)
                            </div>
                        </div><br />
                        @* Consumer Name Ends *@

                        @* For Review Header *@
                        <div class="row">
                            <div class="col-md-3">
                                <span class="profile-name">Enter Review Subject</span>
                            </div>
                            <div class="col-md-3">
                                @Html.TextBoxFor(m => m.ReviewHeader)
                            </div>
                        </div><br />
                        @* Review Header Ends *@

                        @* For Review Header *@
                        <div class="row">
                            <div class="col-md-3">
                                <span class="profile-name">Enter Review Content</span>
                            </div>
                            <div class="col-md-3">
                                @Html.TextBoxFor(m => m.ReviewContent)
                            </div>
                        </div><br />
                        @* Review Header Ends *@


                    </div>
                </div>
            </div>
            @* Button Area Starts*@
            <div class="lender-search">
                <button type="submit" id="btn-gn">Submit</button>
                <button type="reset">Clear</button>
            </div>
            @* Button Area Ends *@
        </div>
    </div>
}

Model:

public class RatingAndReviews
    {
        public int UserId { get; set; }
        public int RatingStar { get; set; }
        public string ConsumerName { get; set; }
        public string ReviewHeader { get; set; }
        public string ReviewContent { get; set; }
    }

Action Post:

 [HttpPost]
        public ActionResult GiveReview(RatingAndReviews model)
        {
            model.InsertRating(model.UserId, model.RatingStar, model.ConsumerName, model.ReviewHeader, model.ReviewContent);
            return View("SubmittedReview", model);
        }

OR Jquery:

<script src="~/Scripts/jquery-1.10.2.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $("#btn-gn").click(function () {
            var RatingStar = $("input[name=star]:checked").val() //Other fields values
            $.ajax({
                url: '@Url.Action("GiveReview", "Home")',
                type: 'POST',
                data: { "UserId": 1, "RatingStar": RatingStar, "ConsumerName": "ABC", "ReviewHeader": "ok", "ReviewContent": "wqsada" },
                success: function (result) {
                    //alert("success");
                    console.log("click");
                },
                error: function (result) {
                    alert("error!");
                }
            });   //end ajax
        });
    });
</script>

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

From Java

How to get value of selected radio button?

From Dev

How to get value of selected radio button in angularjs

From Dev

How to get the value of the selected radio button?

From Dev

How get value of selected radio button in datalist

From Dev

selected value of radio button mvc4

From Dev

How to get the NAME and value of a radio button when DYNAMICALLY selected - in jQuery?

From Dev

How to get selected value of list item in radio button list in jquery

From Dev

How to get selected radio button value onclick from php

From Dev

How to get the selected radio button value inside the form from expressjs?

From Dev

How to get the NAME and value of a radio button when DYNAMICALLY selected - in jQuery?

From Dev

How do i Get value of selected radio button in angularjs?

From Dev

get hidden value of the currently selected radio button

From Dev

get hidden value of the currently selected radio button

From Dev

Get selected radio button value in javascript

From Dev

Get value of selected radio-button?

From Dev

How to get selected radio button from ToggleGroup

From Dev

How to get selected radio button values?

From Dev

How to get the pk of the selected radio button in django

From Dev

How to get last selected radio button id

From Dev

How do I get the correct radio button selected using MVC RadioButtonFor with float values?

From Dev

Selected radio button value not passing with postback data in MVC 5

From Dev

MVC Radio button selected one

From Dev

How to get the selected value from a radio button group in React where there are multiple groups?

From Dev

How to get whole row value if radio button on one cell is selected in php

From Dev

How can I get the selected radio button value on another jsp page?

From Dev

How do I get the value of a user-selected radio button in the controller?

From Dev

How to get the value of a selected radio button and checkbox using its class in jQuery?

From Dev

how to get selected value from radio button from html in angular Js

From Dev

Bootstrap radio button: Get selected value on submit form

Related Related

  1. 1

    How to get value of selected radio button?

  2. 2

    How to get value of selected radio button in angularjs

  3. 3

    How to get the value of the selected radio button?

  4. 4

    How get value of selected radio button in datalist

  5. 5

    selected value of radio button mvc4

  6. 6

    How to get the NAME and value of a radio button when DYNAMICALLY selected - in jQuery?

  7. 7

    How to get selected value of list item in radio button list in jquery

  8. 8

    How to get selected radio button value onclick from php

  9. 9

    How to get the selected radio button value inside the form from expressjs?

  10. 10

    How to get the NAME and value of a radio button when DYNAMICALLY selected - in jQuery?

  11. 11

    How do i Get value of selected radio button in angularjs?

  12. 12

    get hidden value of the currently selected radio button

  13. 13

    get hidden value of the currently selected radio button

  14. 14

    Get selected radio button value in javascript

  15. 15

    Get value of selected radio-button?

  16. 16

    How to get selected radio button from ToggleGroup

  17. 17

    How to get selected radio button values?

  18. 18

    How to get the pk of the selected radio button in django

  19. 19

    How to get last selected radio button id

  20. 20

    How do I get the correct radio button selected using MVC RadioButtonFor with float values?

  21. 21

    Selected radio button value not passing with postback data in MVC 5

  22. 22

    MVC Radio button selected one

  23. 23

    How to get the selected value from a radio button group in React where there are multiple groups?

  24. 24

    How to get whole row value if radio button on one cell is selected in php

  25. 25

    How can I get the selected radio button value on another jsp page?

  26. 26

    How do I get the value of a user-selected radio button in the controller?

  27. 27

    How to get the value of a selected radio button and checkbox using its class in jQuery?

  28. 28

    how to get selected value from radio button from html in angular Js

  29. 29

    Bootstrap radio button: Get selected value on submit form

HotTag

Archive