ভিউ বা আংশিক দর্শন থেকে লেআউট হেডে CSS বা জাভাস্ক্রিপ্ট ফাইল যুক্ত করুন


176

লেআউট পৃষ্ঠাগুলি:

<head>
    <link href="@Url.Content("~/Content/themes/base/Site.css")"
          rel="stylesheet" type="text/css" />
</head>

অ্যাপ্লিকেশন থেকে একটি ভিউ (অন্য ভিউ) প্রয়োজন:

<link href="@Url.Content("~/Content/themes/base/AnotherPage.css")"
      rel="stylesheet" type="text/css" />

এবং অ্যান্ডেলভিউয়ের একটি আংশিক দৃষ্টিভঙ্গি রয়েছে (আওয়ার্ড পার্টিশিয়াল) যার প্রয়োজন:

<link href="@Url.Content("~/Content/themes/base/AnotherPartial.css")"
      rel="stylesheet" type="text/css" />

প্রশ্ন: কীভাবে আমরা করতে পারেন যোগ এইসব সিএসএস ফাইল সংযোগ লেআউট মাথা থেকে AnotherView এবং AnotherPartial লিঙ্ক ?

রেন্ডারসেকশনটি ভাল ধারণা নয় কারণ অ্যান্ডেলপেজে একাধিক পার্টিয়াল থাকতে পারে। সমস্ত সিএসএস প্রধান হিসাবে যুক্ত করা কার্যকর নয় কারণ এটি গতি পরিবর্তন করে (এটি আন্ডারপেজের উপর নির্ভর করে)।


@ নুরিওয়িলমজ আপনার শিরোনাম অনুযায়ী "ভিউ থেকে" এবং "বা আংশিক দর্শন" এর মধ্যে একটি বিশাল পার্থক্য। যাইহোক, এই বিষয়ে কোনও নতুন ধারণা?
শিমি ওয়েটজ্যান্ডলার

উত্তর:


196

লেআউট:

<html>
    <head>
        <meta charset="utf-8" />
        <title>@ViewBag.Title</title>
        <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
        <script src="@Url.Content("~/Scripts/jquery-1.6.2.min.js")" type="text/javascript"></script>
        <script src="@Url.Content("~/Scripts/modernizr-2.0.6-development-only.js")" type="text/javascript"></script>
        @if (IsSectionDefined("AddToHead"))
        {
            @RenderSection("AddToHead", required: false)
        }

        @RenderSection("AddToHeadAnotherWay", required: false)
    </head>

দেখুন:

@model ProjectsExt.Models.DirectoryObject

@section AddToHead{
    <link href="@Url.Content("~/Content/Upload.css")" rel="stylesheet" type="text/css" />
}

5
আমি মনে করি এটিই সহজ সমাধান।
iamichi

বক্স সলিউশন থেকে চমৎকার!
জেরিলেবার্টস

14
AddToHeadবিভাগটি এমবেড করা আংশিক দৃশ্যে থাকলে এটি কাজ করবে না View
শিমি ওয়েইটস্যান্ডলার

57
প্রশ্নটিতে বিশেষভাবে আংশিক দৃষ্টিভঙ্গির উল্লেখ করা হয়েছে এবং এই সর্বোচ্চ রেট করা উত্তরটি সমস্যার সমাধান করে না! এটি অন্য প্রশ্নের জন্য একটি দুর্দান্ত সমাধান হতে পারে, তবে এটির নয়।
ভলকান রেভেন

1
যদি এটি তীব্রভাবে আংশিক দৃষ্টিভঙ্গি নিয়ে কাজ করে তবে একটি মার্জিত সমাধান হত।
জনি

75

আপডেট : https://github.com/speier/mvcassetshelper এ উপলব্ধ বুনিয়াদি উদাহরণ

লেআউট পৃষ্ঠায় জেএস এবং সিএসএস ফাইল যুক্ত করতে আমরা নিম্নলিখিত প্রয়োগটি ব্যবহার করছি।

দেখুন বা আংশিক দেখুন:

@{
    Html.Assets().Styles.Add("/Dashboard/Content/Dashboard.css");
    Html.Assets().Scripts.Add("/Dashboard/Scripts/Dashboard.js");
}

লেআউট পৃষ্ঠা:

<head>
    @Html.Assets().Styles.Render()
</head>

<body>
    ...
    @Html.Assets().Scripts.Render()
</body>

এইচটিএমএল সহায়তা সম্প্রসারণ:

public static class HtmlHelperExtensions
{
    public static AssetsHelper Assets(this HtmlHelper htmlHelper)
    {
        return AssetsHelper.GetInstance(htmlHelper);
    }    
}

public class AssetsHelper 
{
    public static AssetsHelper GetInstance(HtmlHelper htmlHelper)
    {
        var instanceKey = "AssetsHelperInstance";

        var context = htmlHelper.ViewContext.HttpContext;
        if (context == null) return null;

        var assetsHelper = (AssetsHelper)context.Items[instanceKey];

        if (assetsHelper == null)
            context.Items.Add(instanceKey, assetsHelper = new AssetsHelper());

        return assetsHelper;
    }

    public ItemRegistrar Styles { get; private set; }
    public ItemRegistrar Scripts { get; private set; }

    public AssetsHelper()
    {
        Styles = new ItemRegistrar(ItemRegistrarFormatters.StyleFormat);
        Scripts = new ItemRegistrar(ItemRegistrarFormatters.ScriptFormat);
    }
}

public class ItemRegistrar
{
    private readonly string _format;
    private readonly IList<string> _items;

    public ItemRegistrar(string format)
    {
        _format = format;
        _items = new List<string>();
    }

    public ItemRegistrar Add(string url)
    {
        if (!_items.Contains(url))
            _items.Add(url);

        return this;
    }

    public IHtmlString Render()
    {
        var sb = new StringBuilder();

        foreach (var item in _items)
        {
            var fmt = string.Format(_format, item);
            sb.AppendLine(fmt);
        }

        return new HtmlString(sb.ToString());
    }
}

public class ItemRegistrarFormatters
{
    public const string StyleFormat = "<link href=\"{0}\" rel=\"stylesheet\" type=\"text/css\" />";
    public const string ScriptFormat = "<script src=\"{0}\" type=\"text/javascript\"></script>";
}

2
@ জেবেকটন: কোডটি দেখুন এবং Insertপদ্ধতিগুলির সাথে Addপদ্ধতিগুলি প্রতিস্থাপন করুন
ভালামাস

9
@Kalman - এই থ্রেড-নিরাপত্তা (বেশ আমার দৃষ্টিতে সঠিকভাবে) প্রশ্ন বলা হয়েছে: stackoverflow.com/questions/6609586/...
মার্ক Gravell

2
এটি খুব ভুল; এটি হওয়া উচিত [ThreadStatic], বা, বিশেষ করে, সঞ্চিত HttpContext.Items
স্ল্যাक्स

6
আমি কিছু অনুপস্থিত করছি? যদি স্টাইলস.রেন্ডার () কে <শিরোনামে কল করা হয়, তবে <head> এর পরে যুক্ত কোনও CSS ফাইল (অর্থাত্ আংশিক দৃশ্যে যুক্ত ফাইলগুলি) রেন্ডার হবে না। (MVC নিচ থেকে উপস্থাপনা।)
কেন

3
@ ফার্নান্দো কোরিয়া আমার মনে হয় আপনি সব ভুল করে ফেলেছেন। নামের বিভাগগুলি আংশিক দর্শনে কাজ করে না যা এই পুরো থ্রেডের ভিত্তি।
শিমি ওয়েটজ্যান্ডলার

11

দুঃখিতভাবে, এই ডিফল্ট ব্যবহার করতে দ্বারা সম্ভব নয় sectionসাল থেকে, যেমন অন্য ব্যবহারকারী প্রস্তাব sectionশুধুমাত্র তাৎক্ষণিক জন্য উপলব্ধ childএকটি এর View

তবে যা কাজ করে তা প্রতিটি দৃশ্যে বাস্তবায়ন এবং পুনরায় সংজ্ঞা দিচ্ছেsection , অর্থ:

section Head
{
    @RenderSection("Head", false)
}

প্রতিটি তাত্পর্য কেবল তাত্ক্ষণিক শিশুদের নয়, একটি প্রধান বিভাগ বাস্তবায়িত করতে পারে। এটি কেবলমাত্র আংশিকভাবে কাজ করে, বিশেষত একাধিক পার্টিয়াল দিয়ে ঝামেলা শুরু হয় (যেমন আপনি আপনার প্রশ্নে উল্লেখ করেছেন)।

সুতরাং আপনার সমস্যার একমাত্র আসল সমাধান হ'ল এটি ব্যবহার করা ViewBag। সেরাটি সম্ভবত সিএসএস এবং স্ক্রিপ্টগুলির জন্য পৃথক সংগ্রহ (তালিকা) হবে। এটি কাজ করার জন্য, আপনার অবশ্যই নিশ্চিত হওয়া উচিত যে Listকোনও মতামত কার্যকর হওয়ার আগে ব্যবহারটি আরম্ভ করা হয়েছে। (যত্নশীল ছাড়া তারপর আপনি যে দৃশ্য / আংশিক উপরের ভালো জিনিস করতে পারেন করতে পারেন Scriptsবা Stylesমান নাল হল:

ViewBag.Scripts.Add("myscript.js");
ViewBag.Styles.Add("mystyle.css");

বিন্যাসে আপনি সংগ্রহগুলি লুপ করতে পারেন এবং মানগুলির উপর ভিত্তি করে শৈলীগুলি যুক্ত করতে পারেন List

@foreach (var script in ViewBag.Scripts)
{
    <script type="text/javascript" src="@script"></script>
}
@foreach (var style in ViewBag.Styles)
{
    <link href="@style" rel="stylesheet" type="text/css" />
}

আমি মনে করি এটি কুৎসিত, তবে এটি কেবল কাজ করে।

****** আপডেট **** যেহেতু এটি প্রথমে অভ্যন্তরীণ দৃষ্টিভঙ্গিগুলি সম্পাদন করা এবং লেআউট এবং সিএসএস শৈলীর দিকে বেরিয়ে আসার কাজ শুরু করে, তাই সম্ভবত এটি স্টাইলের তালিকাটি উল্টে দেওয়া অর্থপূর্ণ হবে ViewBag.Styles.Reverse()

এইভাবে সর্বাধিক বহিরাগত শৈলীটি যুক্ত করা হয়, যা সিএসএস স্টাইল শীটগুলি যেভাবেই কাজ করে তার সাথে ইনলাইন।


1
ধন্যবাদ এনটিজিওলিস দেখতে দেখতে দেখতে সুন্দর লাগছে তবে, রেজার বিন্যাসের মাথাগুলি অন্য দর্শনের আগে প্রথমে কাজ করে, এবং অন্য স্ক্রিপ্টের আগে স্ক্রিপ্ট এবং। স্টাইলের গতিবিদ্যা খালি ছিল। আমি এটি সম্পর্কে একটি দুর্দান্ত ব্লগ পেয়েছি এবং আমি এই প্রশ্নটি ভাগ করে নিয়েছি।
নুরি ইলিমাজ

এটি কোনও উদ্ভূত দৃশ্যের জন্য কাজ করবে তবে পার্টির জন্য নয়। পার্টিয়ালদের জন্য প্রকৃতপক্ষে মৃত্যুদণ্ডের আদেশটি ভুল। মূলত পার্টিয়ালগুলির জন্য এগুলি শিরোনামের অন্তর্ভুক্ত করার কোনও উপায় নেই। আমি পরামর্শ দেব, এটি হেডারে যুক্ত করার পরিবর্তে এটি কেবল বডি ট্যাগের শুরুতে যুক্ত করুন। এটি আমার প্রথম পছন্দ হবে না, তবে এইভাবে আপনার কাছে সমস্ত স্টাইল / জেএস এক জায়গায় পরিচালনা করার সংক্ষিপ্ত পদ্ধতি রয়েছে, বরং এগুলি চারদিকে ছড়িয়ে দিন।
এনটিজিওলিস

আমি তোমার সাথে একমত কারণ আমি উত্তর হিসাবে তালিকাবদ্ধ হিসাবে আমি কিছু সমাধান পেয়েছি তবে এটি হ'ল জেএস সমাধান solutions আমি সত্যিই ভাবছি কেন আমরা লেআউট পৃষ্ঠাটি ক্লাসিক এসপ নেট হিসাবে ব্যবহার করতে পারিনি। এর অর্থ আমি চাইল্ড পৃষ্ঠা থেকে শীর্ষে পৌঁছে যেতে পারি।
নূরী ইলমাজ

11

আপনি লেআউটে রেন্ডারসেকশন পদ্ধতি দ্বারা বিভাগটি সংজ্ঞায়িত করতে পারেন ।

বিন্যাস

<head>
  <link href="@Url.Content("~/Content/themes/base/Site.css")"
    rel="stylesheet" type="text/css" />
  @RenderSection("heads", required: false)
</head>

তারপরে আপনি আংশিক দৃশ্য ব্যতীত আপনার বিভাগের বিভাগে আপনার সিএসএস ফাইলগুলি অন্তর্ভুক্ত করতে পারেন ।

বিভাগটি দৃষ্টিতে কাজ করে তবে ডিজাইনের মাধ্যমে আংশিক দৃষ্টিতে কাজ করে না

<!--your code -->
@section heads
{
  <link href="@Url.Content("~/Content/themes/base/AnotherPage.css")"
  rel="stylesheet" type="text/css" />
}

আপনি যদি সত্যিই আংশিক দৃশ্যে বিভাগ অঞ্চলটি ব্যবহার করতে চান তবে আপনি নিবন্ধটি রেন্ডারসেকশন পদ্ধতিটিকে নতুন করে সংজ্ঞায়িত করতে পারেন।

রেজার, নেস্টেড লেআউটগুলি এবং পুনরায় সংজ্ঞায়িত বিভাগগুলি - এএসপি.এনইটি-তে মার্সিন


6

আমারও একই সমস্যা ছিল এবং কালামনের দুর্দান্ত উত্তরটি নীচের কোড দিয়ে প্রয়োগ করা শেষ করেছিলাম (বেশ ঝরঝরে নয়, তবে তর্কিতভাবে আরও বিস্তৃত):

namespace MvcHtmlHelpers
{
    //http://stackoverflow.com/questions/5110028/add-css-or-js-files-to-layout-head-from-views-or-partial-views#5148224
    public static partial class HtmlExtensions
    {
        public static AssetsHelper Assets(this HtmlHelper htmlHelper)
        {
            return AssetsHelper.GetInstance(htmlHelper);
        }
    }
    public enum BrowserType { Ie6=1,Ie7=2,Ie8=4,IeLegacy=7,W3cCompliant=8,All=15}
    public class AssetsHelper
    {
        public static AssetsHelper GetInstance(HtmlHelper htmlHelper)
        {
            var instanceKey = "AssetsHelperInstance";
            var context = htmlHelper.ViewContext.HttpContext;
            if (context == null) {return null;}
            var assetsHelper = (AssetsHelper)context.Items[instanceKey];
            if (assetsHelper == null){context.Items.Add(instanceKey, assetsHelper = new AssetsHelper(htmlHelper));}
            return assetsHelper;
        }
        private readonly List<string> _styleRefs = new List<string>();
        public AssetsHelper AddStyle(string stylesheet)
        {
            _styleRefs.Add(stylesheet);
            return this;
        }
        private readonly List<string> _scriptRefs = new List<string>();
        public AssetsHelper AddScript(string scriptfile)
        {
            _scriptRefs.Add(scriptfile);
            return this;
        }
        public IHtmlString RenderStyles()
        {
            ItemRegistrar styles = new ItemRegistrar(ItemRegistrarFormatters.StyleFormat,_urlHelper);
            styles.Add(Libraries.UsedStyles());
            styles.Add(_styleRefs);
            return styles.Render();
        }
        public IHtmlString RenderScripts()
        {
            ItemRegistrar scripts = new ItemRegistrar(ItemRegistrarFormatters.ScriptFormat, _urlHelper);
            scripts.Add(Libraries.UsedScripts());
            scripts.Add(_scriptRefs);
            return scripts.Render();
        }
        public LibraryRegistrar Libraries { get; private set; }
        private UrlHelper _urlHelper;
        public AssetsHelper(HtmlHelper htmlHelper)
        {
            _urlHelper = new UrlHelper(htmlHelper.ViewContext.RequestContext);
            Libraries = new LibraryRegistrar();
        }
    }
    public class LibraryRegistrar
    {
        public class Component
        {
            internal class HtmlReference
            {
                internal string Url { get; set; }
                internal BrowserType ServeTo { get; set; }
            }
            internal List<HtmlReference> Styles { get; private set; }
            internal List<HtmlReference> Scripts { get; private set; }
            internal List<string> RequiredLibraries { get; private set; }

            public Component()
            {
                Styles = new List<HtmlReference>();
                Scripts = new List<HtmlReference>();
                RequiredLibraries = new List<string>();
            }
            public Component Requires(params string[] libraryNames)
            {
                foreach (var lib in libraryNames)
                {
                    if (!RequiredLibraries.Contains(lib))
                        { RequiredLibraries.Add(lib); }
                }
                return this;
            }
            public Component AddStyle(string url, BrowserType serveTo = BrowserType.All)
            {
                Styles.Add(new HtmlReference { Url = url, ServeTo=serveTo });
                return this;
            }
            public Component AddScript(string url, BrowserType serveTo = BrowserType.All)
            {
                Scripts.Add(new HtmlReference { Url = url, ServeTo = serveTo });
                return this;
            }
        }
        private readonly Dictionary<string, Component> _allLibraries = new Dictionary<string, Component>();
        private List<string> _usedLibraries = new List<string>();
        internal IEnumerable<string> UsedScripts()
        {
            SetOrder();
            var returnVal = new List<string>();
            foreach (var key in _usedLibraries)
            {
                returnVal.AddRange(from s in _allLibraries[key].Scripts
                                   where IncludesCurrentBrowser(s.ServeTo)
                                   select s.Url);
            }
            return returnVal;
        }
        internal IEnumerable<string> UsedStyles()
        {
            SetOrder();
            var returnVal = new List<string>();
            foreach (var key in _usedLibraries)
            {
                returnVal.AddRange(from s in _allLibraries[key].Styles
                                   where IncludesCurrentBrowser(s.ServeTo)
                                   select s.Url);
            }
            return returnVal;
        }
        public void Uses(params string[] libraryNames)
        {
            foreach (var name in libraryNames)
            {
                if (!_usedLibraries.Contains(name)){_usedLibraries.Add(name);}
            }
        }
        public bool IsUsing(string libraryName)
        {
            SetOrder();
            return _usedLibraries.Contains(libraryName);
        }
        private List<string> WalkLibraryTree(List<string> libraryNames)
        {
            var returnList = new List<string>(libraryNames);
            int counter = 0;
            foreach (string libraryName in libraryNames)
            {
                WalkLibraryTree(libraryName, ref returnList, ref counter);
            }
            return returnList;
        }
        private void WalkLibraryTree(string libraryName, ref List<string> libBuild, ref int counter)
        {
            if (counter++ > 1000) { throw new System.Exception("Dependancy library appears to be in infinate loop - please check for circular reference"); }
            Component library;
            if (!_allLibraries.TryGetValue(libraryName, out library))
                { throw new KeyNotFoundException("Cannot find a definition for the required style/script library named: " + libraryName); }
            foreach (var childLibraryName in library.RequiredLibraries)
            {
                int childIndex = libBuild.IndexOf(childLibraryName);
                if (childIndex!=-1)
                {
                    //child already exists, so move parent to position before child if it isn't before already
                    int parentIndex = libBuild.LastIndexOf(libraryName);
                    if (parentIndex>childIndex)
                    {
                        libBuild.RemoveAt(parentIndex);
                        libBuild.Insert(childIndex, libraryName);
                    }
                }
                else
                {
                    libBuild.Add(childLibraryName);
                    WalkLibraryTree(childLibraryName, ref libBuild, ref counter);
                }
            }
            return;
        }
        private bool _dependenciesExpanded;
        private void SetOrder()
        {
            if (_dependenciesExpanded){return;}
            _usedLibraries = WalkLibraryTree(_usedLibraries);
            _usedLibraries.Reverse();
            _dependenciesExpanded = true;
        }
        public Component this[string index]
        {
            get
            {
                if (_allLibraries.ContainsKey(index))
                    { return _allLibraries[index]; }
                var newComponent = new Component();
                _allLibraries.Add(index, newComponent);
                return newComponent;
            }
        }
        private BrowserType _requestingBrowser;
        private BrowserType RequestingBrowser
        {
            get
            {
                if (_requestingBrowser == 0)
                {
                    var browser = HttpContext.Current.Request.Browser.Type;
                    if (browser.Length > 2 && browser.Substring(0, 2) == "IE")
                    {
                        switch (browser[2])
                        {
                            case '6':
                                _requestingBrowser = BrowserType.Ie6;
                                break;
                            case '7':
                                _requestingBrowser = BrowserType.Ie7;
                                break;
                            case '8':
                                _requestingBrowser = BrowserType.Ie8;
                                break;
                            default:
                                _requestingBrowser = BrowserType.W3cCompliant;
                                break;
                        }
                    }
                    else
                    {
                        _requestingBrowser = BrowserType.W3cCompliant;
                    }
                }
                return _requestingBrowser;
            }
        }
        private bool IncludesCurrentBrowser(BrowserType browserType)
        {
            if (browserType == BrowserType.All) { return true; }
            return (browserType & RequestingBrowser) != 0;
        }
    }
    public class ItemRegistrar
    {
        private readonly string _format;
        private readonly List<string> _items;
        private readonly UrlHelper _urlHelper;

        public ItemRegistrar(string format, UrlHelper urlHelper)
        {
            _format = format;
            _items = new List<string>();
            _urlHelper = urlHelper;
        }
        internal void Add(IEnumerable<string> urls)
        {
            foreach (string url in urls)
            {
                Add(url);
            }
        }
        public ItemRegistrar Add(string url)
        {
            url = _urlHelper.Content(url);
            if (!_items.Contains(url))
                { _items.Add( url); }
            return this;
        }
        public IHtmlString Render()
        {
            var sb = new StringBuilder();
            foreach (var item in _items)
            {
                var fmt = string.Format(_format, item);
                sb.AppendLine(fmt);
            }
            return new HtmlString(sb.ToString());
        }
    }
    public class ItemRegistrarFormatters
    {
        public const string StyleFormat = "<link href=\"{0}\" rel=\"stylesheet\" type=\"text/css\" />";
        public const string ScriptFormat = "<script src=\"{0}\" type=\"text/javascript\"></script>";
    }
}

প্রকল্পটিতে একটি স্থিতিশীল AssignAllRes উত্স পদ্ধতি রয়েছে:

assets.Libraries["jQuery"]
        .AddScript("~/Scripts/jquery-1.10.0.min.js", BrowserType.IeLegacy)
        .AddScript("~/Scripts//jquery-2.0.1.min.js",BrowserType.W3cCompliant);
        /* NOT HOSTED YET - CHECK SOON 
        .AddScript("//ajax.googleapis.com/ajax/libs/jquery/2.0.1/jquery.min.js",BrowserType.W3cCompliant);
        */
    assets.Libraries["jQueryUI"].Requires("jQuery")
        .AddScript("//ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js",BrowserType.Ie6)
        .AddStyle("//ajax.aspnetcdn.com/ajax/jquery.ui/1.9.2/themes/eggplant/jquery-ui.css",BrowserType.Ie6)
        .AddScript("//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js", ~BrowserType.Ie6)
        .AddStyle("//ajax.aspnetcdn.com/ajax/jquery.ui/1.10.3/themes/eggplant/jquery-ui.css", ~BrowserType.Ie6);
    assets.Libraries["TimePicker"].Requires("jQueryUI")
        .AddScript("~/Scripts/jquery-ui-sliderAccess.min.js")
        .AddScript("~/Scripts/jquery-ui-timepicker-addon-1.3.min.js")
        .AddStyle("~/Content/jQueryUI/jquery-ui-timepicker-addon.css");
    assets.Libraries["Validation"].Requires("jQuery")
        .AddScript("//ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js")
        .AddScript("~/Scripts/jquery.validate.unobtrusive.min.js")
        .AddScript("~/Scripts/mvcfoolproof.unobtrusive.min.js")
        .AddScript("~/Scripts/CustomClientValidation-1.0.0.min.js");
    assets.Libraries["MyUtilityScripts"].Requires("jQuery")
        .AddScript("~/Scripts/GeneralOnLoad-1.0.0.min.js");
    assets.Libraries["FormTools"].Requires("Validation", "MyUtilityScripts");
    assets.Libraries["AjaxFormTools"].Requires("FormTools", "jQueryUI")
        .AddScript("~/Scripts/jquery.unobtrusive-ajax.min.js");
    assets.Libraries["DataTables"].Requires("MyUtilityScripts")
        .AddScript("//ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/jquery.dataTables.min.js")
        .AddStyle("//ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/css/jquery.dataTables.css")
        .AddStyle("//ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/css/jquery.dataTables_themeroller.css");
    assets.Libraries["MvcDataTables"].Requires("DataTables", "jQueryUI")
        .AddScript("~/Scripts/jquery.dataTables.columnFilter.min.js");
    assets.Libraries["DummyData"].Requires("MyUtilityScripts")
        .AddScript("~/Scripts/DummyData.js")
        .AddStyle("~/Content/DummyData.css");     

_লআউট পৃষ্ঠায়

@{
    var assets = Html.Assets();
    CurrentResources.AssignAllResources(assets);
    Html.Assets().RenderStyles()
}
</head>
...
    @Html.Assets().RenderScripts()
</body>

এবং আংশিক (গুলি) এবং দর্শনগুলিতে

Html.Assets().Libraries.Uses("DataTables");
Html.Assets().AddScript("~/Scripts/emailGridUtilities.js");

মজাদার. ওভারকিলের মতো মনে হয় তবে আমি দেখতে পাচ্ছি যে এটি ওয়েবসাইটগুলির সাথে আরও বেশি ব্যবহৃত হচ্ছে, তবে এর পুরানো সংস্করণ ব্যবহারকারীদের সাথে ব্যবহার করার জন্য ... যেমন কর্পোরেট পরিবেশে যেখানে কিছু দেশ আপগ্রেড হয়নি এবং আপনি নিজেকে গুলি করতে চান। হাঃ হাঃ হাঃ. +1 এর জন্য
pqsk

5

আমি এই সমস্যাটি সমাধান করার চেষ্টা করেছি।

আমার উত্তর এখানে।

"ডায়নামিকহাইডার" - http://dynamicheader.codeplex.com/ , https://nuget.org/packages/DynamicHeader

উদাহরণস্বরূপ, _Layout.cshtml হ'ল:

<head>
@Html.DynamicHeader()
</head>
...

এবং, আপনি যে কোনও জায়গায় .js এবং .css ফাইলগুলিকে "ডায়নামিকহাইডার" এ নিবন্ধন করতে পারেন।

এক্সপ্লেরিয়াল এর জন্য, অ্যানড্রিয়াল পার্টিশিয়াল কোডশটমে কোড ব্লকটি হ'ল:

@{
  DynamicHeader.AddSyleSheet("~/Content/themes/base/AnotherPartial.css");
  DynamicHeader.AddScript("~/some/myscript.js");
}

তারপরে, ফাইনাল আউটপুট এইচটিএমএল হ'ল:

<html>
  <link href="/myapp/Content/themes/base/AnotherPartial.css" .../>
  <script src="/myapp/some/myscript.js" ...></script>
</html>
...

4

বাক্সের বাইরে সমাধানটি চেষ্টা করুন (ASP.NET MVC 4 বা তারপরে):

@{
    var bundle = BundleTable.Bundles.GetRegisteredBundles().First(b => b.Path == "~/js");

    bundle.Include("~/Scripts/myFile.js");
}

আমি একটি ত্রুটি পাচ্ছি:CS0103: The name 'BundleTable' does not exist in the current context
কুণাল

এনভিএম: এটি সমাধান করেছেন। সংযোজন করতে ছিল System.Web.Optimizationঅর্থাতSystem.Web.Optimization.BundleTable.Bundles.GetRegisteredBundles().First(b => b.Path == "~/bundles/css");
কুনাল

1
এটি কী বিশ্বব্যাপী বান্ডিলটি পরিবর্তন করে না? আপনি যদি পৃষ্ঠার এ এবং পরে খোলার পৃষ্ঠায় বি পৃষ্ঠায় এটি করেন তবে পৃষ্ঠা বিতেও আমার ফাইলে রয়েছে jjs অন্তর্ভুক্ত থাকবে যা আমি মনে করি না যে ওপি চেয়েছিল
মাইল 82

4

আমরা যারা এএসপি.নেট এমভিসি 4 ব্যবহার করি তাদের পক্ষে - এটি সহায়ক হতে পারে।

প্রথমে, আমি অ্যাপ_সার্ট ফোল্ডারে একটি বান্ডেলকনফিগ ক্লাস যুক্ত করেছি।

আমার কোডটি যা আমি এটি তৈরি করতে ব্যবহার করেছি:

using System.Web.Optimization;

public class BundleConfig
{
    public static void RegisterBundles(BundleCollection bundles)
    {
        bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/SiteMaster.css"));
    }
}

দ্বিতীয়ত, আমি গ্লোবাল.এক্স্যাক্স ফাইলে বান্ডেলকনফিগ ক্লাসটি নিবন্ধিত করেছি:

protected void Application_Start()
{
    BundleConfig.RegisterBundles(BundleTable.Bundles);
}

তৃতীয়, আমি আমার সিএসএস ফাইলে শৈলীর সাহায্যকারী যুক্ত করেছি:

/* Styles for validation helpers */
.field-validation-error {
    color: red;
    font-weight: bold;
}

.field-validation-valid {
    display: none;
}

input.input-validation-error {
    border: 1px solid #e80c4d;
}

input[type="checkbox"].input-validation-error {
    border: 0 none;
}

.validation-summary-errors {
    color: #e80c4d;
    font-weight: bold;
    font-size: 1.1em;
}

.validation-summary-valid {
    display: none;
}

অবশেষে আমি এই সিনট্যাক্সটি কোনও দৃশ্যে ব্যবহার করেছি:

@Styles.Render("~/Content/css")

3

এখানে ক্যাসেট নামে একটি নিউগেট প্লাগইন রয়েছে , যা অন্যান্য জিনিসের মধ্যে আপনাকে পার্টিয়ালগুলিতে স্ক্রিপ্টগুলি এবং স্টাইলগুলি উল্লেখ করার ক্ষমতা প্রদান করে।

যদিও এই প্লাগইনটির জন্য বেশ কয়েকটি কনফিগারেশন উপলব্ধ রয়েছে যা এটি অত্যন্ত নমনীয় করে তোলে। এখানে স্ক্রিপ্ট বা স্টাইলশিট ফাইলগুলি উল্লেখ করার সহজ উপায়:

Bundles.Reference("scripts/app");

ডকুমেন্টেশন অনুযায়ী :

কল Reference কোনও পৃষ্ঠা, বিন্যাস বা আংশিক দৃশ্যে যে কোনও জায়গায় উপস্থিত পারে।

পথের যুক্তি নিম্নলিখিতগুলির মধ্যে একটি হতে পারে:

  • একটি বান্ডিল পাথ
  • একটি সম্পত্তির পথ - এই সম্পদটি সহ পুরো বান্ডিলটি রেফারেন্স করা হয়
  • একটি ইউআরএল

2

আমি একটি সহজ মোড়ক লিখেছিলাম যা আপনাকে প্রতিটি আংশিক দৃশ্যে শৈলী এবং শিরোনামে হেড ট্যাগের নিবন্ধে স্টাইল এবং স্ক্রিপগুলি নিবন্ধ করতে দেয়।

এটি ডায়নামিকহাইডার জেসকমোটোর উপর ভিত্তি করে তৈরি হয়েছে তবে এতে কিছু কার্য সম্পাদন ও টুইট রয়েছে।

এটি ব্যবহার করা খুব সহজ এবং বহুমুখী।

ব্যবহার:

@{
    DynamicHeader.AddStyleSheet("/Content/Css/footer.css", ResourceType.Layout);    
    DynamicHeader.AddStyleSheet("/Content/Css/controls.css", ResourceType.Infrastructure);
    DynamicHeader.AddScript("/Content/Js/Controls.js", ResourceType.Infrastructure);
    DynamicHeader.AddStyleSheet("/Content/Css/homepage.css");    
}

আপনি সম্পূর্ণ কোড, ব্যাখ্যা এবং উদাহরণ ভিতরে খুঁজে পেতে পারেন: হেড ট্যাগে স্টাইল এবং স্ক্রিপ্টগুলি গতিশীলভাবে যুক্ত করুন

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.