Click here to Skip to main content
15,867,686 members
Please Sign up or sign in to vote.
1.00/5 (1 vote)
When i am calling the services in the post of j query ajax in mvc ?For that i am Checking to passing some id,value is coming in controller or not,But showing that value is Null in Break point ? Gave me some proper guides to my code .

What I have tried:

Code of controller:---
[HttpPost]
              public JsonResult Filters(string id)
               {
               var sd= id;
                return Json(sd, JsonRequestBehavior.AllowGet);
                }


Code of View:---

<script src="~/Scripts/jquery-1.10.2.min.js"></script>
  <script>
    $(document).ready(function ()
    {
            $('#rating-5').click(function ()
            {
              alert($('#rating-5').attr("value"));
              var fe = $('#rating-5').val("5");
                 alert(fe);

                 $.ajax
                     ({
                         url: '/Home/Filters',
                         // url:'/Home/Rating',
                         //contentType: 'application/json; charset=utf-8',
                         type: 'POST',
                         data: { sdsd: $('#rating-5').attr("value") },
                         dataType: 'json',
                         success: function (result) {
                             alert(result);
                             console.log(result);

                         },
                         error: function (status)
                         {
                             alert(status);
                         }
                     });
            });
        });
   
</script>

<pre><body>

               <div class="widget-sidebar start-rating-sidebar">
                    <h4 class="title-sidebar">Star rating</h4>
                     <ul class="widget-rate">
                     <li>
               <div class="radio-checkbox">
                      <input id="rating-5" type="checkbox" class="checkbox">
                      <label for="rating-5"></label>
               </div>
               <div class="group-star">
                  class="glyphicon glyphicon-star"__^
                 ^__i class="glyphicon glyphicon-star"__^ </i__^ 
                 ^__i class="glyphicon glyphicon-star"__^ 
                 ^__i class="glyphicon glyphicon-star"__^
               </div>5 Stars <span>12</span>
                        </li>
                         <li>
               <div class="radio-checkbox">
                    <input id="rating-4" type="checkbox" class="checkbox">
                    <label for="rating-4"></label>
               </div>
               <div class="group-star">
                 ^__i class="glyphicon glyphicon-star"__^
                 ^__i class="glyphicon glyphicon-star"__^ 
                 ^__i class="glyphicon glyphicon-star"__^
                ^__i class="glyphicon glyphicon-star"__^
             </div>4 Stars <span>12</span></li>
                   <li>
             <div class="radio-checkbox">
                  <input id="rating-3" type="checkbox" class="checkbox">
                   <label for="rating-3"></label>
             </div>
             <div class="group-star">
              ^__i class="glyphicon glyphicon-star"__^
              ^__i class="glyphicon glyphicon-star"__^ 
              ^__i class="glyphicon glyphicon-star"__^
            </div>3 Stars <span>12</span>
                  </li>
                   <li>
            <div class="radio-checkbox">
              <input id="rating-2" type="checkbox" class="checkbox">
                 <label for="rating-2"></label>
             </div>
             <div class="group-star">
               ^__i class="glyphicon glyphicon-star"> 
               ^__i class="glyphicon glyphicon-star">
             </div>2 Stars <span>12</span>
                     </li>
                     <li>
             <div class="radio-checkbox">
               <input id="rating-1" type="checkbox" class="checkbox">
                  <label for="rating-1"></label>
              </div>
             <div class="group-star">
              ^__i class="glyphicon glyphicon-star">
            </div>1 Stars <span>12</span>
               </li>
               <li>
            <div class="radio-checkbox">
              <input id="rating-6" type="checkbox" class="checkbox">
              <label for="rating-6"></label>
            </div>
          <div class="group-star">
          ^__i class="glyphicon glyphicon-star-empty">
      </div>Not Rated <span>12</span>
                 </li>
                </ul>
               </div>
</body>


Issues is:-when checkbox click is value 5 is displaying in alter box.But in controller value showing null what ?
Posted
Updated 12-Jun-18 1:12am

1 solution

try

$('#rating-5').click(function () {
          alert($('#rating-5').prop("checked"));
          $.ajax
              ({
                  url: '/Home/Filters',
                  type: 'POST',
                  data: { id: $('#rating-5').prop("checked") },
                  dataType: 'json',
                  success: function (result) {
                      alert(result);
                      console.log(result);
                  },
                  error: function (status) {
                      alert(status);
                  }
              });
      });


The argument name in the controller method and ajax "data" property should be same, in your case it is "id" and "sdsd"
To get the value from the checkbox use "checked" property.
 
Share this answer
 
Comments
Member 13823448 13-Jun-18 0:54am    
Thank u
Karthik_Mahalingam 13-Jun-18 1:39am    
welcome
Member 13823448 13-Jun-18 2:07am    
Sir, How can i get hotels data only for one night depending upon price range using WebApi services Jquery Ajax in Mvc.
Karthik_Mahalingam 13-Jun-18 4:54am    
write a query with the conditions as one night and add a price between condition.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900