Home / Community & Support / Developer Productivity Tools Forums / Telerik MVC Extensions (superseded) > General Discussions > ScriptRegistrar creates two jQuery blocks in Razor view

• King Wilder Master

  Posted on Apr 29, 2011 (permalink)

  I have a weird issue.  Here's my application specs:
  

  • ASP.NET MVC 3
  • Razor views
  • Telerik Extensions for Mvc version 2011.1.315.340

  
  The issue renders double script blocks on partial Razor view.
  
  Here's the ScriptRegistrar in my layout master:
  
  

      @(Html.Telerik().ScriptRegistrar().DefaultGroup(group => group.Combined(true).Compress(true)

      .Add("jquery.validate.js")

      .Add("jquery.validate.unobtrusive.js")

      .Add("pngfix.js")

      .Add("menu_ie.js")))

  </body>

  </html>

  
  Here's the ScriptRegistrar with OnDocumentReady in my partial Razor view:
  
  

  @(Html.Telerik().ScriptRegistrar()

      .OnDocumentReady(

      @<text>

          var passwordField = $("#PasswordText");

   

          $("#generate-password").click(function () {

   

              $.ajax({

                  url: '@Url.Action("GeneratePassword", "Password")',

                  dataType: 'json',

                  type: 'GET',

                  success: function (data) {

                      if (data.Success) {

                          passwordField.val(data.Message);

                      }

                  }

              });

          });

      </text>

      ))

  
  Here's the produced HTML source output:
  
  

  <script type="text/javascript" src="/Scripts/2011.1.315/jquery-1.5.1.min.js"></script>

  <script type="text/javascript">

  //<![CDATA[

  jQuery(document).ready(function(){

       

                      var passwordField = $("#PasswordText");

   

          $("#generate-password").click(function () {

   

              $.ajax({

                  url: '/Password/GeneratePassword',

                  dataType: 'json',

                  type: 'GET',

                  success: function (data) {

                      if (data.Success) {

                          passwordField.val(data.Message);

                      }

                  }

              });

          });

       

  });

  //]]>

  </script>

   

   

          </div>

   

          <div class="gap10">

          </div>

      </div>

   

      <!--/WRAPPER-->

   

      <script type="text/javascript" src="/asset.axd?id=9AAAAB-LCAAAAAAABADsvQdgHEmWJSYvbcp7f0r1StfgdKEIgGATJNiQQBDswYjN5pLsHWlHIymrKoHKZVZlXWYWQMztnbz33nvvvffee--997o7nU4n99__P1xmZAFs9s5K2smeIYCqyB8_fnwfPyJ-8Uezjx597xd_tPro0Uevp3WxapuPRh-d82dL-uynf9E6r6-3d8f3x7vjn8Z31UePdn7JyP92fJmVxSxrc9tgd6jBellN2nrdFJeu8Z5pvFpenBfv7Of3zOeLfLn-_Qv3wv4v-f4v-f7oo2lL37X5u_buT2eXWcPIU4NL-nRvZ3eX8L23e58-mNII7316n3756BH1nf-S_ycAAP__oCxA8PQAAAA%3d"></script>

  <script type="text/javascript">

  //<![CDATA[

  jQuery(document).ready(function(){

       

                      var passwordField = $("#PasswordText");

   

          $("#generate-password").click(function () {

   

              $.ajax({

                  url: '/Password/GeneratePassword',

                  dataType: 'json',

                  type: 'GET',

                  success: function (data) {

                      if (data.Success) {

                          passwordField.val(data.Message);

                      }

                  }

              });

          });

       

  });

  //]]>

  </script>

  </body>

  </html>

  
  Any ideas why this is rendering twice?  It also seems to be affecting my results.
  
  Any help is appreciated.
  

  Reply

• Atanas Korchev Atanas Korchev

  Posted on Apr 30, 2011 (permalink)

  Hello King Wilder,

   It is rendering twice because you are rendering it twice. The @(Html.Telerik().ScriptRegistrar()) syntax means "output a script registrar". You need to use @{ } in order to just declare a ScriptRegistrar in your partial view.

  Kind regards,
  Atanas Korchev
  the Telerik team

  Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

  Reply

• King Wilder Master

  Posted on Apr 30, 2011 (permalink)

  Atanas,
  
  That did the trick!  I guess I need to read up a bit more on the razor syntax.  :^)
  
  Now I just have to figure out why I'm getting an "invalid label" from my ajax call.  It's always something.
  
  Thanks.

  Reply

• King Wilder Master

  Posted on Apr 30, 2011 (permalink)

  I know this is not related to this thread but it might help others, as I found the solution to the "invalid label" json error.
  
  http://stackoverflow.com/questions/4886525/jquery-1-5-ajax-call-fails-with-invalid-label-for-json-requests
  
  It seems there might be a bug in jQuery 1.5.x for ajax calls that injects jsonp into json calls.
  
  This was my solution:
  
  Before solution:
  
  

  @{Html.Telerik().ScriptRegistrar()

      .OnDocumentReady(

      @<text>

          var passwordField = $("#PasswordText");

   

          $("#generate-password").click(function () {

   

              $.ajax({

                  url: '@Url.Action("GeneratePassword", "Password")',

                  dataType: 'json',

                  type: 'GET',

                  success: OnGeneratePasswordSuccess,

                  error: OnGeneratePasswordError

              });

          });

   

          function OnGeneratePasswordSuccess(data){

              if (data.Success) {

                  passwordField.val(data.Message);

              }

          }

   

          function OnGeneratePasswordError(xhr, status, error){

              alert("There was an error generating the password. - Status: " + status + " - Error: " + error);

          }

      </text>

      );}

  
  After solution:
  
  

  @{Html.Telerik().ScriptRegistrar()

      .OnDocumentReady(

      @<text>

          var passwordField = $("#PasswordText");

   

          $("#generate-password").click(function () {

   

              $.ajax({

                  url: '@Url.Action("GeneratePassword", "Password")',

                  dataType: 'json',

                  type: 'GET',

                  jsonp: null,              <-- Added this line

                  jsonpCallback: null,      <-- and this line

                  success: OnGeneratePasswordSuccess,

                  error: OnGeneratePasswordError

              });

          });

   

          function OnGeneratePasswordSuccess(data){

              if (data.Success) {

                  passwordField.val(data.Message);

              }

          }

   

          function OnGeneratePasswordError(xhr, status, error){

              alert("There was an error generating the password. - Status: " + status + " - Error: " + error);

          }

      </text>

      );}

  
  I hope this helps others with this problem.

  Reply

• Dan

  Posted on May 15, 2012 (permalink)

  Can you post an example about what you mean about using @{}.  I am having the same problem and don't understand.

  Reply

Back to Top

Home / Community & Support / Developer Productivity Tools Forums / Telerik MVC Extensions (superseded) > General Discussions > ScriptRegistrar creates two jQuery blocks in Razor view