+1-888-365-2779
Try Now
More in this section

Forums / General Discussions / How to avoid Conflicts in Sitefinity MVC Widgets

How to avoid Conflicts in Sitefinity MVC Widgets

3 posts, 0 answered
  1. Nelson
    Nelson avatar
    13 posts
    Registered:
    29 Jul 2015
    01 Sep 2015
    Link to this post

    Hello,

     I'm having some conflicts when applying styles and Jquery/javascript to Different Widgets. I want each widget to have its own Style and its Own Jquery and Javascrip functions.
    What's happening is that I'm applying in one widget preventDefault to all its textboxes, and the other MVC widgets' textboxes get affected too. I'm also applying different css to the widgets and there are conflicts too.

    Maybe the good practice is to use the same css to all widgets. but still when I want to apply something like preventDefault to all its textboxes, all my widgets get affected.
    How can I avoid this?

    Im developing ASP.NET MVC Widgets and this is my widgets structure:

    <script src="@Url.Content("~/Scripts/jquery-1.11.3.js")"></script><link rel="stylesheet" href="~/Content/bootstrap.css" /><link rel="stylesheet" href="http://cdn.kendostatic.com/2015.2.805/styles/kendo.common-bootstrap.min.css" /><link rel="stylesheet" href="http://cdn.kendostatic.com/2015.2.805/styles/kendo.bootstrap.min.css" />
    <style> //addicional style <style>

    <script>//scripts...</script>

    <div> Content... </div>

    Some advices about good practices, documentation, or code would be great.

     

    Best Regards,

     

  2. Nelson
    Nelson avatar
    13 posts
    Registered:
    29 Jul 2015
    07 Sep 2015
    Link to this post
    Did anyone experience this?
  3. Nikola Zagorchev
    Nikola Zagorchev avatar
    424 posts
    Registered:
    29 Sep 2016
    12 Sep 2015
    Link to this post
    Hello Nelson,

    It is generally recommended to structure your code and reuse it where possible. This also applies to scripts and styles. You can reference the main scripts or styles in the page template or layout used for the widgets. If you want to have different behavior in each of them, you can wrap the whole widget template/view in a container element, for example a div element and style this element and its children. You can base the styles on different selectors that you will be able to reuse. The same applies to the javscript - if you want particular script to apply only to a specific widgets, modify your selectors and logic to match only elements in the widget container.
    For instance, this way you can select all textboxes in that particular widget (widget container element) and set on logic only to them.

    Regards,
    Nikola Zagorchev
    Telerik
     
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Sitefinity CMS Ideas&Feedback Portal and vote to affect the priority of the items
     
Register for webinar
3 posts, 0 answered