2013-02-26 1 views
1

У меня есть серверный элемент управления, как показано ниже:Разработка серверного элемента управления пользовательского asp.net кода визуализации сценариев

[DefaultProperty("ContentKey")] 
    [ToolboxData("<{0}:ContentRating runat=server></{0}:ContentRating>")] 
    public class ContentRating : WebControl 
    { 
     [Bindable(true)] 
     [Category("Appearance")] 
     [DefaultValue("")] 
     [Localizable(true)] 
     public string ContentKey 
     { 
      get 
      { 
       String s = (String)ViewState["ContentKey"]; 
       return ((s == null) ? "[" + this.ID + "]" : s); 
      } 

      set 
      { 
       ViewState["ContentKey"] = value; 
      } 
     } 

     protected override void RenderContents(HtmlTextWriter output) 
     { 
      StringBuilder builder = new StringBuilder(@"<div id=""divContentRating""> 
    <div id=""divAskForRating""> 
     #Question 
     <br /> 
     <a id=""likeIcon""><img src=""~/Content/Images/like.jpg""/></a> 
     <a id=""neutralIcon""><img src=""~/Content/Images/neutral.jpg""/></a> 
     <a id=""unlikeIcon""><img src=""~/Content/Images/unlike.jpg""/></a> 
    </div> 
    <div id=""divPositiveRating""> 
     <div> 
      <img src=""~/Content/Images/like.jpg""/> #PositiveAnswerMessage <br /> 
      <a href=""javascript:void(0)"" class=""updateRate"">Güncelle</a> 
     </div> 
    </div> 
    <div id=""divNegativeRating""> 
     <div> 
      <img src=""~/Content/Images/unlike.jpg""/> #NegativeAnswerMessage <br /> 
      <a href=""javascript:void(0)"" class=""updateRate"">Güncelle</a> 
     </div> 
    </div> 
    <div id=""divNeutralRating""> 
     <div> 
      <img src=""~/Content/Images/neutral.jpg""/> #NeutralAnswerMessage <br /> 
      <a href=""javascript:void(0)"" class=""updateRate"">Güncelle</a> 
     </div> 
    </div> 

    <input type=""hidden"" id=""HasRated"" value=""False""> 
    <input type=""hidden"" id=""Rate"" value=""Rate""> 
    <input type=""hidden"" id=""ContentKey"" value=""#ContentKey""> 
    <input type=""hidden"" id=""RatingId"" value=""RatingId""> 

    <script type=""text/javascript""> 
    $(document).ready(function() { 
     var protocol = location.protocol; 
     var host = window.location.host; 

     if ($(""#HasRated"").val() == """"True"") 
     { 
      var rate = $(""#Rate"").val(); 
      if (rate == 1) { 
       setPositiveRatedView(); 
      } 
      else if (rate == 0) { 
       setNeutralRatedView(); 
      } 
      else if (rate == -1) { 
       setNegativeRatedView(); 
      } 
      else { 
       setNotRatedView(); 
      } 
     } 
     else { 
      setNotRatedView(); 
     } 

     $(""#likeIcon"").click(function() { 
      alert(""like""); 
      setPositiveRatedView(); 
      ratePage(1, """"); 
     }); 

     $(""#neutralIcon"").click(function() { 
      alert(""neutral""); 
      setNeutralRatedView(); 
      ratePage(0, """"); 
     }); 

     $(""#unlikeIcon"").click(function() { 
      alert(""unlike""); 
      setNegativeRatedView(); 
      //mkMPopClc('NegativeRatingReason', 200, 300, 0, 0); 
     }); 

     $("".updateRate"").click(function() { 
      setNotRatedView(); 
     }); 

//  $('.clsStl').click(function() { 
//   ratePage(-1, """"); 
//   $('.mkMPop').fadeOut(); 
//  }); 
// 
//  $('#ShareComment').click(function() { 
//   ratePage(-1, $(""#Comment"").val()); 
//   $('.mkMPop').fadeOut(); 
//  }); 

     function setNotRatedView() { 
      $(""#divNeutralRating"").fadeOut(); 
      $(""#divPositiveRating"").fadeOut(); 
      $(""#divAskForRating"").fadeIn(); 
      $(""#divNegativeRating"").fadeOut(); 
     } 

     function setPositiveRatedView() 
     { 
      $(""#divNegativeRating"").fadeOut(); 
      $(""#divNeutralRating"").fadeOut(); 
      $(""#divAskForRating"").fadeOut(); 
      $(""#divPositiveRating"").fadeIn(); 
     } 

     function setNegativeRatedView() { 
      $(""#divNeutralRating"").fadeOut(); 
      $(""#divPositiveRating"").fadeOut(); 
      $(""#divAskForRating"").fadeOut(); 
      $(""#divNegativeRating"").fadeIn(); 
     } 

     function setNeutralRatedView() { 
      $(""#divNegativeRating"").fadeOut(); 
      $(""#divPositiveRating"").fadeOut(); 
      $(""#divAskForRating"").fadeOut(); 
      $(""#divNeutralRating"").fadeIn(); 
     } 

     function ratePage(rating, comment) 
     { 
      //alert(rating + """" """" + comment); 
      var contentKey = $(""#ContentKey"").val(); 
      var hasRated = $(""#HasRated"").val(); 
      var ratingId = $(""#RatingId"").val(); 

      $.getJSON(protocol + '//' + host + '/tr/Rating/RatePage?contentKey=' + contentKey + '&rating=' + rating + '&ratingUpdate=' + hasRated + '&ratingId=' + ratingId + '&comment=' + comment, function (data) { 
       $(""#HasRated"").val(data.HasRated); 
       $(""#Rate"").val(data.Rate); 
       $(""#ContentKey"").val(data.ContentKey); 
       $(""#RatingId"").val(data.RatingId); 
       $(""#Comment"").val(data.Comment); 
      }); 
     } 
    }); 
</script> 
</div>"); 

      builder.Replace("#ContentKey", this.ContentKey); 

      output.Write(builder); 
     } 
    } 

Когда я добавить свой контроль на моей веб-странице, я вижу, что управление делает, как я ожидал, но Скрипты jquery не работают. Неправильно ли хранить код сценария в серверном элементе управления? Что я могу сделать для решения этой проблемы?

+0

Существует потенциальная проблема с контролем: $ (документ) .ready (функция() {...}). Лучше всего, если вы можете использовать PreRender событие вашего контроля и зарегистрировать JS, используя Page.RegisterClientScript. –

ответ

2
if ($(""#HasRated"").val() == """"True"") 

Я думаю, что у вас слишком много кавычек там ...

+0

Вы правы. благодаря – anilca

Смежные вопросы