Custom Selectors in MVC

Apr 11, 2012 at 10:33 PM
Edited Apr 11, 2012 at 11:45 PM

Hi There,

Great Plugin.  I got the demo to work. So i thought I would give it a whirl in my twitter app.

I am using mvc 4.  I can get the stars to display but i am doing something wrong with the selectors and data selector

The Tweet Rating is the last field at the bottom.  The item.statusid is unique too.

Any ideas?  I am sorry if this looks like a mess but I am trying alot of ways.

 

 

    //we bind only to the rateit controls within the products div
     //$('#products .rateit').bind('rated reset', function (e) {
     $("[div^='TweetMessageRating'] .TweetRating").bind('rated reset'function (e) {
        // $("[div^='TweetMessageRating'] .rateit").bind('rated reset', function (e) {
    // $("#TweetRating .rateit").bind('rated reset', function (e) {
         //    $("['#TweetRating'] .rateit").bind('rated reset', function (e) {
 
 
         var ri = $(this);
     
         //if the use pressed reset, it will get value: 0 (to be compatible with the HTML range control), we could check if e.type == 'reset', and then set the value to  null .
         var value = ri.rateit('value');
         //var productID = ri.data('productid'); // if the product id was in some hidden field: ri.closest('li').find('input[name="productid"]').val()
         //  var RatingId = ri.data(ri.closest('div').find('input[name="RatingId"]').val());
         //   var ratingid =  ri.data(ri.closest('div').find('input[name="RatingId"]').val());
          var ratingid = ri.data('ratingid');
         //  $("[#div^='TweetMessageRating'] .rateit")
         //maybe we want to disable voting?
         ri.rateit('readonly'true);
 
         $.ajax({
             url: '/Home/GetRating'//your server side script
             data: { id: ratingid, value: value }, //our data
             type: 'POST',
             success: function (data) {
                 $('#response').append('<li>' + data + '</li>');
 
             },
             error: function (jxhr, msg, err) {
                 $('#response').append('<li style="color:red">' + msg + '</li>');
             }
         });
     });
 </script>
 
@foreach (var item in Model)
{ 
   <div id="TwitterMessageBox@(item.StatusId.ToString())" class="TwitterMessageBox">
@*    @MvcHtmlString.Create(@Html.TweetMessageid(@item.StatusId))*@
  
        <ol>
            <li class="TweetLineBody">
               
                <div class="TwitProfileImage">
                    <img src=@Url.Content(item.ImageUrl) alt="@item.ScreenName" />
                </div>
                <div class="TwitRealName">
                    @item.User
                </div>
                <div class="TwitNickName">
                    @MvcHtmlString.Create(@Html.Namify(@item.ScreenName))
                </div>
                <div class="TweetText">
                    @MvcHtmlString.Create(@item.Tweet)</div>
                <div class="TweetTime">
                    @Html.RelativeDate(@item.Created)</div>
 
                <div id="TweetMessageRating@(item.StatusId.ToString())" class="TweetRating">
                @Html.Hidden("ratingid", item.StatusId)
                    Rating <div id="TweetRating" data-ratingid="@item.StatusId.ToString()" class="rateit"></div>
                    
                    
                 </div>
            </li>
        </ol>
      
 </div>
}
I made a change to the hidden
  <input type="hidden" id="ratingid_190221813366784000" name="ratingid_190221813366784000" value="190221813366784000" />

still cant get it
Apr 12, 2012 at 1:31 AM

I got it to work somewhat,  selectors arent my strong suit. I made the ids unique then called the class as a selector so it will be unique