একটি আংশিক থেকে একটি রেজার বিভাগ পপুলেট করুন


102

এটি করার চেষ্টা করার জন্য আমার মূল প্রেরণা হল জাভাস্ক্রিপ্টটি পাওয়া যা কেবলমাত্র জাভাস্ক্রিপ্টের বাকী অংশের সাথে পৃষ্ঠার নীচে একটি আংশিক দ্বারা প্রয়োজনীয় এবং পৃষ্ঠার যেখানে মাঝখানে আংশিক রেন্ডার করা হয়েছে তার মাঝখানে নয়।

আমি যা করার চেষ্টা করছি তার একটি সরল উদাহরণ এখানে:

এখানে দেহের ঠিক আগে স্ক্রিপ্টস বিভাগ সহ বিন্যাস রয়েছে।

<!DOCTYPE html>
<html>
<head>
    <title>@ViewBag.Title</title>
    <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />    
</head>

<body>
    @RenderBody()
    <script src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript"></script>
    @RenderSection("Scripts", false)
</body>
</html>

এই লেআউটটি ব্যবহার করে এখানে একটি উদাহরণ দেখুন।

<h2>This is the view</h2>

@{Html.RenderPartial("_Partial");}

@section Scripts {
<script type="text/javascript">
        alert("I'm a view.");
</script>
}

এবং এখানে আংশিক দৃশ্য থেকে রেন্ডার করা হচ্ছে।

<p>This is the partial.</p>

@* this never makes it into the rendered page *@
@section Scripts {
<script type="text/javascript">
    alert("I'm a partial."); 
</script>
}

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


আংশিক .. আইডি কে .. আপনার কোডটি কিছুটা বিভ্রান্তিকর কারণ হতে পারে বলে আপনার সমস্যাটি হতে পারে
গিদিওন

এটা না। এমনকি যদি বিভাগটি দেখার বাইরে চলে যায় তবে আংশিক কোডগুলি চূড়ান্ত রেন্ডারড পৃষ্ঠাতে তৈরি করে না। আমি মনে করি যে স্ল্যাকস সঠিক যে পার্টিয়ালগুলি প্যারেন্ট ভিউয়ের বিভাগগুলিতে অংশ নিতে পারে না।
ক্রেগ এম

উত্তর:


78

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

এখানে সহায়তার পদ্ধতিগুলি:

public static string RequireScript(this HtmlHelper html, string path, int priority = 1)
{
    var requiredScripts = HttpContext.Current.Items["RequiredScripts"] as List<ResourceInclude>;
    if (requiredScripts == null) HttpContext.Current.Items["RequiredScripts"] = requiredScripts = new List<ResourceInclude>();
    if (!requiredScripts.Any(i => i.Path == path)) requiredScripts.Add(new ResourceInclude() { Path = path, Priority = priority });
    return null;
}

public static HtmlString EmitRequiredScripts(this HtmlHelper html)
{
    var requiredScripts = HttpContext.Current.Items["RequiredScripts"] as List<ResourceInclude>;
    if (requiredScripts == null) return null;
    StringBuilder sb = new StringBuilder();
    foreach (var item in requiredScripts.OrderByDescending(i => i.Priority))
    {
        sb.AppendFormat("<script src=\"{0}\" type=\"text/javascript\"></script>\n", item.Path);
    }
    return new HtmlString(sb.ToString());
}
public class ResourceInclude
{
    public string Path { get; set; }
    public int Priority { get; set; }
}

এটি একবার হয়ে গেলে আপনার আংশিক দৃশ্যের জন্য কেবল কল করা দরকার @Html.RequireScript("/Path/To/Script")

এবং লেআউট ভিউয়ের হেড সেকশনে আপনাকে কল করুন @Html.EmitRequiredScripts()

এর একটি যুক্ত বোনাস হ'ল এটি আপনাকে সদৃশ স্ক্রিপ্টের অনুরোধগুলি ছাড়ে allows যদি আপনার একাধিক মতামত / আংশিক দর্শন থাকে যা প্রদত্ত স্ক্রিপ্টের প্রয়োজন হয় তবে আপনি নিরাপদে ধরে নিতে পারেন যে আপনি কেবল একবার এটি আউটপুট পাবেন


মার্জিত এবং পরিষ্কার সমাধান। +1
বেভাকাকুয়া

আমার বেশিরভাগ চুল টেনে বের করে
সবেমাত্র

আমি কাজের এই সমাধান পেতে পারি না। মনে হয় যে কোনও আংশিক দৃষ্টিতে প্রয়োজনীয়তা স্ক্রিপ্ট () কল করতে পারার আগেই EmitRequiredScript () কল হয়ে যায়। আমি কি ভুল কিছু করছি?
ব্রায়ান রথ

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

1
অ্যাপ্লিকেশনটির নতুন সংস্করণ স্থাপন করার সময় এর কি কোনও ক্যাশে বস্টিং সমর্থন রয়েছে? আউট অফ-বক্স @ স্ক্রিপ্টস R রেন্ডার () পদ্ধতিটি শেষের দিকে তৈরি হওয়া URL টি প্যারামিটারটি আটকে রাখে যাতে কোনও নতুন সংস্করণ স্থাপন করা হলে ব্রাউজারটি সর্বশেষতম সংস্করণ আনতে বাধ্য হয়।
সাইমন গ্রিন

28

আংশিক দর্শনগুলি তাদের পিতামাতার মতামতের বিভাগগুলিতে অংশ নিতে পারে না।


1
এটাই আমার সন্দেহ হয়েছিল। ধন্যবাদ।
ক্রেগ এম

@ জোহান বুবরিস্কি রেজার 2 এ আছে। সংস্করণ।
শিমি ওয়েটজ্যান্ডলার

@ এসএলাকস, ডিজাইনের মাধ্যমে এটি কেন? আমার দৃশ্যে আমার একটি আংশিক রয়েছে যা ব্যানার রোটার, আমি চাই এটির স্ক্রিপ্ট / স্টাইলগুলি কেবল তখনই লোড হয়, কেন এটি ইনলাইন লোড করা খারাপ?
শিমি ওয়েটজ্যান্ডলার

2
@ শিম্মি: আপনার ক্যাসেটের মতো একটি রিসোর্স ম্যানেজমেন্ট সিস্টেম ব্যবহার করা উচিত।
এসএলএক্স

ধন্যবাদ. আমি এটার দিকে নজর রাখব.
শিমি ওয়েটজ্যান্ডলার

13

আপনার কাছে দ্বিতীয় আংশিক থাকতে পারে যা কেবলমাত্র প্রয়োজনীয় জাভাস্ক্রিপ্ট ইনজেকশনের দায়িত্বে রয়েছে। @ifব্লকগুলির আশেপাশে বেশ কয়েকটি স্ক্রিপ্টগুলি রাখুন , যদি আপনি চান:

@model string
@if(Model == "bla") {
    <script type="text/javascript">...</script>
}

@else if(Model == "bli") {
    <script type="text/javascript">...</script>
}

এটি সম্ভবত কিছুটা পরিষ্কার করা যেতে পারে, তবে তারপরে Scriptsআপনার দর্শন বিভাগে:

@section Scripts
{
    @Html.Partial("_Scripts", "ScriptName_For_Partial1")
}

আবার এটি কোনও সৌন্দর্য পুরষ্কার না জিততে পারে তবে এটি কার্যকর হবে।


1
আমি যা করতে পেরেছি এটির খুব কাছে। এটি অবশ্যই সুন্দর নয়, তবে এটি কার্যকর। এর একমাত্র ক্ষতিটি হ'ল আপনি অজ্যাক্স কলের মাধ্যমে আংশিকটি পেতে এবং জেএসকে অন্তর্ভুক্ত করতে পারবেন না। আমি দীর্ঘমেয়াদে ভাবি, আমি jQuery টেমপ্লেটগুলি ব্যবহার করে রিফ্যাক্টরিং শেষ করতে যাচ্ছি এবং সার্ভার সাইডে এইচটিএমএল তৈরির পরিবর্তে আমার নিয়ন্ত্রণকারীদের থেকে জেএসএন প্রেরণ করব।
ক্রেগ এম

@ ক্রেইগএম যেখানে আমি এগিয়ে চলেছি। এমভিসি বৈধ, তবে টেমপ্লেটগুলি ক্লায়েন্ট-সাইড (আমি ব্যাকবোন.জেএস-এ দেখছি) ব্যবহার করতে এবং তারপরে একটি এপিআই থেকে চাপ / টানতে এত বেশি জ্ঞান অর্জন করে।
one.beat.consumer

@ one.beat.customer - আমি যখন থেকে ব্যাকবোনও ব্যবহার করি তখন থেকে আমি আন্ডারস্কোরের টেম্পলেট ব্যবহার করি, তবে আমি টুইটার থেকে হোগান লাইব্রেরিতে বা নোডিজিটস থেকে প্লেটগুলি স্যুইচ করার কথা ভাবছি। দুজনেরই বেশ সুন্দর বৈশিষ্ট্য রয়েছে।
ক্রেগ এম

10

এটি করার আরও মার্জিত উপায় হ'ল আংশিক দৃশ্য স্ক্রিপ্টগুলি পৃথক ফাইলে স্থানান্তরিত করা এবং তারপরে দেখার স্ক্রিপ্ট বিভাগে এটি রেন্ডার করুন:

<h2>This is the view</h2>

@Html.RenderPartial("_Partial")

@section Scripts
{
    @Html.RenderPartial("_PartialScripts")

    <script type="text/javascript">
        alert("I'm a view script.");
    </script>
}

আংশিক দৃশ্য _ আংশিক. cshtml :

<p>This is the partial.</p>

আংশিক দৃশ্য _ কেবলমাত্র স্ক্রিপ্টগুলির সাথে আংশিক দৃশ্য _

<script type="text/javascript">
    alert("I'm a partial script!");
</script>

এটি অন্যান্য উত্তরের প্রস্তাবিত কিছু এক্সটেনশন পদ্ধতি বা প্লাগ-ইনয়ের মতো স্বয়ংক্রিয় নয় তবে এর সরলতা এবং স্পষ্টতার সুবিধা রয়েছে। এটা ভাল লেগেছে।
মার্ক মিউয়ার

7

ফরলুপ.এইচটিএমএল হেল্পার্স নুগেট প্যাকেজটি ইনস্টল করুন - এটি আংশিক দর্শন এবং সম্পাদক টেম্পলেটগুলিতে স্ক্রিপ্টগুলি পরিচালনার জন্য কিছু সহায়ক যুক্ত করে।

আপনার লেআউটের কোথাও, আপনাকে কল করতে হবে

@Html.RenderScripts()

এটি যেখানে পৃষ্ঠায় কোনও স্ক্রিপ্ট ফাইল এবং স্ক্রিপ্ট ব্লকগুলি আউটপুট করা হবে তাই আমি এটিকে আপনার মূল স্ক্রিপ্টগুলি বিন্যাসে এবং একটি স্ক্রিপ্ট বিভাগের পরে রাখার পরামর্শ দিচ্ছি (যদি আপনার একটি থাকে)।

আপনি যদি বান্ডিলিংয়ের সাথে ওয়েব অপ্টিমাইজেশন ফ্রেমওয়ার্ক ব্যবহার করেন তবে আপনি ওভারলোডটি ব্যবহার করতে পারেন

@Html.RenderScripts(Scripts.Render)

যাতে এই পদ্ধতিটি স্ক্রিপ্ট ফাইলগুলি লেখার জন্য ব্যবহৃত হয়।

এখন, আপনি যে কোনও সময় কোনও দৃশ্য, আংশিক দর্শন বা টেম্পলেটটিতে স্ক্রিপ্ট ফাইল বা ব্লক যুক্ত করতে চান, কেবল ব্যবহার করুন

@using (Html.BeginScriptContext())
{
  Html.AddScriptFile("~/Scripts/jquery.validate.js");
  Html.AddScriptBlock(
    @<script type="text/javascript">
       $(function() { $('#someField').datepicker(); });
     </script>
  );
}

সহায়করা নিশ্চিত করে যে একাধিকবার যোগ করা হলে কেবলমাত্র একটি স্ক্রিপ্ট ফাইলের রেফারেন্স রেন্ডার করা হয়েছে এবং এটিও নিশ্চিত করে যে স্ক্রিপ্ট ফাইলগুলি প্রত্যাশিত ক্রমে রেন্ডার করা হয়েছে অর্থাৎ

  1. বিন্যাস
  2. পার্টিয়ালস এবং টেম্পলেটগুলি (ক্রম অনুযায়ী তারা দৃশ্যে প্রদর্শিত হবে, উপরে থেকে নীচে)

5

[আপডেট হওয়া সংস্করণ] ইনলাইন স্ক্রিপ্টগুলি অন্তর্ভুক্ত করতে নেક્રোকুবাস প্রশ্নের পরে আপডেট হওয়া সংস্করণ।

public static class ScriptsExtensions
{
    const string REQ_SCRIPT = "RequiredScript";
    const string REQ_INLINESCRIPT = "RequiredInlineScript";
    const string REQ_STYLE = "RequiredStyle";

    #region Scripts
    /// <summary>
    /// Adds a script 
    /// </summary>
    /// <param name="html"></param>
    /// <param name="path"></param>
    /// <param name="priority">Ordered by decreasing priority </param>
    /// <param name="bottom"></param>
    /// <param name="options"></param>
    /// <returns></returns>
    public static string RequireScript(this IHtmlHelper html, string path, int priority = 1, bool bottom=false, params string[] options)
    {
        var ctxt = html.ViewContext.HttpContext;

        var requiredScripts = ctxt.Items[REQ_SCRIPT] as List<ResourceToInclude>;
        if (requiredScripts == null) ctxt.Items[REQ_SCRIPT] = requiredScripts = new List<ResourceToInclude>();
        if (!requiredScripts.Any(i => i.Path == path)) requiredScripts.Add(new ResourceToInclude() { Path = path, Priority = priority, Options = options, Type=ResourceType.Script, Bottom=bottom});
        return null;
    }

    /// <summary>
    /// 
    /// </summary>
    /// <param name="html"></param>
    /// <param name="script"></param>
    /// <param name="priority">Ordered by decreasing priority </param>
    /// <param name="bottom"></param>
    /// <returns></returns>
    public static string RequireInlineScript(this IHtmlHelper html, string script, int priority = 1, bool bottom = false)
    {
        var ctxt = html.ViewContext.HttpContext;

        var requiredScripts = ctxt.Items[REQ_INLINESCRIPT] as List<InlineResource>;
        if (requiredScripts == null) ctxt.Items[REQ_INLINESCRIPT] = requiredScripts = new List<InlineResource>();
        requiredScripts.Add(new InlineResource() { Content=script, Priority = priority, Bottom=bottom, Type=ResourceType.Script});
        return null;
    }

    /// <summary>
    /// Just call @Html.EmitRequiredScripts(false)
    /// at the end of your head tag and 
    /// @Html.EmitRequiredScripts(true) at the end of the body if some scripts are set to be at the bottom.
    /// </summary>
    public static HtmlString EmitRequiredScripts(this IHtmlHelper html, bool bottom)
    {
        var ctxt = html.ViewContext.HttpContext;

        var requiredScripts = ctxt.Items[REQ_SCRIPT] as List<ResourceToInclude>;
        var requiredInlineScripts = ctxt.Items[REQ_INLINESCRIPT] as List<InlineResource>;
        var scripts = new List<Resource>();
        scripts.AddRange(requiredScripts ?? new List<ResourceToInclude>());
        scripts.AddRange(requiredInlineScripts ?? new List<InlineResource>());
        if (scripts.Count==0) return null;
        StringBuilder sb = new StringBuilder();
        foreach (var item in scripts.Where(s=>s.Bottom==bottom).OrderByDescending(i => i.Priority))
        {
            sb.Append(item.ToString());
        }
        return new HtmlString(sb.ToString());
    }
    #endregion Scripts

    #region Styles
    /// <summary>
    /// 
    /// </summary>
    /// <param name="html"></param>
    /// <param name="path"></param>
    /// <param name="priority">Ordered by decreasing priority </param>
    /// <param name="options"></param>
    /// <returns></returns>
    public static string RequireStyle(this IHtmlHelper html, string path, int priority = 1, params string[] options)
    {
        var ctxt = html.ViewContext.HttpContext;

        var requiredScripts = ctxt.Items[REQ_STYLE] as List<ResourceToInclude>;
        if (requiredScripts == null) ctxt.Items[REQ_STYLE] = requiredScripts = new List<ResourceToInclude>();
        if (!requiredScripts.Any(i => i.Path == path)) requiredScripts.Add(new ResourceToInclude() { Path = path, Priority = priority, Options = options });
        return null;
    }

    /// <summary>
    /// Just call @Html.EmitRequiredStyles()
    /// at the end of your head tag
    /// </summary>
    public static HtmlString EmitRequiredStyles(this IHtmlHelper html)
    {
        var ctxt = html.ViewContext.HttpContext;

        var requiredScripts = ctxt.Items[REQ_STYLE] as List<ResourceToInclude>;
        if (requiredScripts == null) return null;
        StringBuilder sb = new StringBuilder();
        foreach (var item in requiredScripts.OrderByDescending(i => i.Priority))
        {
            sb.Append(item.ToString());
        }
        return new HtmlString(sb.ToString());
    }
    #endregion Styles

    #region Models
    public class InlineResource : Resource
    {
        public string Content { get; set; }
        public override string ToString()
        {
            return "<script>"+Content+"</script>";
        }
    }

    public class ResourceToInclude : Resource
    {
        public string Path { get; set; }
        public string[] Options { get; set; }
        public override string ToString()
        {
            switch(Type)
            {
                case ResourceType.CSS:
                    if (Options == null || Options.Length == 0)
                        return String.Format("<link rel=\"stylesheet\" href=\"{0}\" type=\"text/css\" />\n", Path);
                    else
                        return String.Format("<link rel=\"stylesheet\" href=\"{0}\" type=\"text/css\" {1} />\n", Path, String.Join(" ", Options));
                default:
                case ResourceType.Script:
                    if (Options == null || Options.Length == 0)
                        return String.Format("<script src=\"{0}\" type=\"text/javascript\"></script>\n", Path);
                    else
                        return String.Format("<script src=\"{0}\" type=\"text/javascript\" {1}></script>\n", Path, String.Join(" ", Options));
            }
        }
    }
    public class Resource
    {
        public ResourceType Type { get; set; }
        public int Priority { get; set; }
        public bool Bottom { get; set; }
    }
    public enum ResourceType
    {
        Script,
        CSS
    }
    #endregion Models
}

আমার 2 সেন্ট, এটি একটি পুরানো পোস্ট, তবে এখনও প্রাসঙ্গিক, সুতরাং এখানে মিস্টার বেলের সমাধানের একটি আপগ্রেড করা আপডেট রয়েছে যা এএসপি.নেট কোরের সাথে কাজ করে।

এটি আমদানিকৃত আংশিক দর্শন এবং সংক্ষিপ্তসারগুলি থেকে মূল লেআউটে স্ক্রিপ্টগুলি এবং শৈলী যুক্ত করার অনুমতি দেয় এবং স্ক্রিপ্ট / শৈলী আমদানিতে বিকল্পগুলি যোগ করার সম্ভাবনা দেয় (যেমন এসিঙ্ক ডিফার ইত্যাদি):

public static class ScriptsExtensions
{
    const string REQ_SCRIPT = "RequiredScript";
    const string REQ_STYLE = "RequiredStyle";

    public static string RequireScript(this IHtmlHelper html, string path, int priority = 1, params string[] options)
    {
        var ctxt = html.ViewContext.HttpContext;

        var requiredScripts = ctxt.Items[REQ_SCRIPT] as List<ResourceInclude>;
        if (requiredScripts == null) ctxt.Items[REQ_SCRIPT] = requiredScripts = new List<ResourceInclude>();
        if (!requiredScripts.Any(i => i.Path == path)) requiredScripts.Add(new ResourceInclude() { Path = path, Priority = priority, Options = options });
        return null;
    }


    public static HtmlString EmitRequiredScripts(this IHtmlHelper html)
    {
        var ctxt = html.ViewContext.HttpContext;

        var requiredScripts = ctxt.Items[REQ_SCRIPT] as List<ResourceInclude>;
        if (requiredScripts == null) return null;
        StringBuilder sb = new StringBuilder();
        foreach (var item in requiredScripts.OrderByDescending(i => i.Priority))
        {
            if (item.Options == null || item.Options.Length == 0)
                sb.AppendFormat("<script src=\"{0}\" type=\"text/javascript\"></script>\n", item.Path);
            else
                sb.AppendFormat("<script src=\"{0}\" type=\"text/javascript\" {1}></script>\n", item.Path, String.Join(" ", item.Options));

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


    public static string RequireStyle(this IHtmlHelper html, string path, int priority = 1, params string[] options)
    {
        var ctxt = html.ViewContext.HttpContext;

        var requiredScripts = ctxt.Items[REQ_STYLE] as List<ResourceInclude>;
        if (requiredScripts == null) ctxt.Items[REQ_STYLE] = requiredScripts = new List<ResourceInclude>();
        if (!requiredScripts.Any(i => i.Path == path)) requiredScripts.Add(new ResourceInclude() { Path = path, Priority = priority, Options = options });
        return null;
    }


    public static HtmlString EmitRequiredStyles(this IHtmlHelper html)
    {
        var ctxt = html.ViewContext.HttpContext;

        var requiredScripts = ctxt.Items[REQ_STYLE] as List<ResourceInclude>;
        if (requiredScripts == null) return null;
        StringBuilder sb = new StringBuilder();
        foreach (var item in requiredScripts.OrderByDescending(i => i.Priority))
        {
            if (item.Options == null || item.Options.Length == 0)
                sb.AppendFormat("<link rel=\"stylesheet\" href=\"{0}\" type=\"text/css\" />\n", item.Path);
            else
                sb.AppendFormat("<link rel=\"stylesheet\" href=\"{0}\" type=\"text/css\" {1} />\n", item.Path, String.Join(" ", item.Options));
        }
        return new HtmlString(sb.ToString());
    }


    public class ResourceInclude
    {
        public string Path { get; set; }
        public int Priority { get; set; }
        public string[] Options { get; set; }
    }
}

আপনি মানুষ ধন্যবাদ! এটি আরও উন্নত করা উচিত কারণ এটি 6 বছরের পুরানো উত্তরের চেয়ে বেশি প্রাসঙ্গিক।
Necroqubus

এছাড়াও, এই এক্সটেনশানগুলি স্ক্রিপ্টগুলির বিভাগগুলিকে ইনপুট হিসাবে মঞ্জুরি দেওয়ার জন্য সংশোধন করা যেতে পারে? @ <text> </text> বা বিভাগের মতো কিছু? অন্যথায় সার্ভার সাইড মডেল ভেরিয়েবলগুলি সহ অন্যান্য স্ক্রিপ্টটি আরম্ভ করার জন্য আমার এখনও একটি ছোট জেএস স্ক্রিপ্ট দরকার: /
নেক্রোকুবাস

@ নেক্রোকুবাস আপনি আপডেট করা সংস্করণটি পরীক্ষা করতে পারবেন, তবে আমি এখনও এটি পরীক্ষা করে দেখিনি :)
জিন

ঠিক আছে, আমি চেষ্টা করব এবং এটি আপনার জন্য পরীক্ষা করব। আমি আশা করি এটি এএসপি.নেট কোর 1.0 এমভিসির সাথে কাজ করে। প্রসঙ্গে আমার নেস্টেড পার্টিয়ালের একাধিক স্তর রয়েছে এবং তাদের স্ক্রিপ্টগুলি ফুটারে রেন্ডার করা চাই।
Necroqubus

দরকার নেই <text>, কেবল স্ট্রিং হিসাবে যুক্ত করুন (আপনি যদি পছন্দ করেন তবে মাল্টি লাইনের জন্য আপনি "@" এর সাথে উপসর্গ করতে পারেন), এবং <script>ট্যাগগুলি ছাড়াই
জিন

1

আপনি একটি নতুন Layoutপৃষ্ঠা তৈরি করতে পারেন এবং একটি সম্পূর্ণ দৃশ্যের আংশিক দৃশ্যটি আবশ্যক যা সামগ্রীগুলি এবং যে কোনও লাইব্রেরি বিভাগগুলি রেন্ডারিংয়ের জন্য দায়ী।

উদাহরণস্বরূপ, ধরা যাক আমার কাছে নিম্নলিখিত কোড রয়েছে:

HomeController.cs

[HttpGet]
public ActionResult About()
{
    var vm = new AboutViewModel();
    return View("About", vm);
}

যখন পূর্ণ পৃষ্ঠা দর্শনটি রেন্ডার করা হয়, তখন সাধারণত দুটি ফাইল মার্জ করে রেন্ডার করা হয়:

About.cshtml

@model AboutViewModel

@{
    ViewBag.Title = "About CSHN";
}

<h3>@ViewBag.Title</h3>

@section Styles {
    <style> /* style info here */ </style>
}

@section Scripts {
    <script> /* script info here */ </script>
}

_Layout.cshtml (বা _ভিউ স্টার্টে নির্দিষ্ট করা আছে বা পৃষ্ঠাতে ওভাররাইড করা আছে)

<!DOCTYPE html>

<html>
<head>
    @RenderSection("Styles", false)
    <title>@ViewBag.Title</title>
</head>
<body>
    @RenderBody()

    @RenderSection("scripts", false)
</body>
</html>

এখন , ধরুন আপনি About.cshtmlএকটি আংশিক ভিউ হিসাবে রেন্ডার করতে চেয়েছিলেন , সম্ভবত এজেএক্স কলটির প্রতিক্রিয়ায় মডেল উইন্ডো হিসাবে। এখানে লক্ষ্যটি হ'ল _Layout.cshtmlমাস্টার লেআউটে অন্তর্ভুক্ত সমস্ত ব্লাট ছাড়াই (সম্পূর্ণ <html>ডকুমেন্টের মতো) প্রায় পৃষ্ঠা, স্ক্রিপ্টস এবং সমস্তগুলিতে নির্দিষ্ট করা সামগ্রীগুলিই ফিরিয়ে দেওয়া ।

আপনি এটির মতো চেষ্টা করে দেখতে পারেন, তবে এটি বিভাগের কোনও সাথেই আসে না:

return PartialView("About", vm);

পরিবর্তে, এর মতো একটি সরল বিন্যাস পৃষ্ঠা যুক্ত করুন:

_PartialLayout.cshtml

<div>
    @RenderBody()
    @RenderSection("Styles", false)
    @RenderSection("scripts", false)
</div>

বা এই জাতীয় মডেল উইন্ডো সমর্থন করতে:

_ModalLayout.cshtml

<div class="modal modal-page fade" tabindex="-1" role="dialog" >
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">

            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">@ViewBag.Title</h4>
            </div>

            <div class="modal-body">

                @RenderBody()
                @RenderSection("Styles", false)
                @RenderSection("scripts", false)

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-inverse" data-dismiss="modal">Dismiss</button>
            </div>
        </div>
    </div>
</div>

তারপরে আপনি এই নিয়ামক বা অন্য কোনও হ্যান্ডলারের একটি কাস্টম মাস্টার ভিউ নির্দিষ্ট করতে পারেন যা আপনি একই সাথে একটি দর্শন সামগ্রী এবং স্ক্রিপ্ট রেন্ডার করতে চান

[HttpGet]
public ActionResult About()
{
    var vm = new AboutViewModel();
    return !Request.IsAjaxRequest()
              ? View("About", vm)
              : View("About", "~/Views/Shared/_ModalLayout.cshtml", vm);
}

1

যারা অ্যাস্পনেট কোর 2.0 সংস্করণ সন্ধান করছেন তাদের জন্য:

    using System.Collections.Generic;
    using System.Linq;
    using System.Text;
    using Microsoft.AspNetCore.Html;
    using Microsoft.AspNetCore.Http;

    public static class HttpContextAccessorExtensions
    {
        public static string RequireScript(this IHttpContextAccessor htmlContextAccessor, string path, int priority = 1)
        {
            var requiredScripts = htmlContextAccessor.HttpContext.Items["RequiredScripts"] as List<ResourceInclude>;
            if (requiredScripts == null) htmlContextAccessor.HttpContext.Items["RequiredScripts"] = requiredScripts = new List<ResourceInclude>();
            if (requiredScripts.All(i => i.Path != path)) requiredScripts.Add(new ResourceInclude() { Path = path, Priority = priority });
            return null;
        }

        public static HtmlString EmitRequiredScripts(this IHttpContextAccessor htmlContextAccessor)
        {
            var requiredScripts = htmlContextAccessor.HttpContext.Items["RequiredScripts"] as List<ResourceInclude>;
            if (requiredScripts == null) return null;
            StringBuilder sb = new StringBuilder();
            foreach (var item in requiredScripts.OrderByDescending(i => i.Priority))
            {
                sb.AppendFormat("<script src=\"{0}\" type=\"text/javascript\"></script>\n", item.Path);
            }
            return new HtmlString(sb.ToString());
        }
        public class ResourceInclude
        {
            public string Path { get; set; }
            public int Priority { get; set; }
        }
    }

স্ক্রিপ্টগুলি বিভাগ কল সরবরাহ করার পরে আপনার বিন্যাসে যুক্ত করুন:

@HttpContextAccessor.EmitRequiredScripts()

এবং আপনার আংশিক দৃষ্টিতে:

@inject IHttpContextAccessor HttpContextAccessor

...

@HttpContextAccessor.RequireScript("/scripts/moment.min.js")

0

উপরের মিঃ বেল এবং শিমির উত্তরের ভিত্তিতে, আমি বান্ডিল স্ক্রিপ্টের জন্য অতিরিক্ত ফাংশন যুক্ত করছি।

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Text;
using System.Web.Mvc;
namespace ABC.Utility
{
public static  class PartialViewHelper
{
    public static string RequireScript(this HtmlHelper html, string path, int priority = 1)
    {
        var requiredScripts = HttpContext.Current.Items["RequiredScripts"] as List<ResourceInclude>;
        if (requiredScripts == null) HttpContext.Current.Items["RequiredScripts"] = requiredScripts = new List<ResourceInclude>();
        if (!requiredScripts.Any(i => i.Path == path)) requiredScripts.Add(new ResourceInclude() { Path = path, Priority = priority });
        return null;
    }

    public static string RequireBundleStyles(this HtmlHelper html, string bundleName)
    {
        var a = System.Web.Optimization.Styles.Render(bundleName);
        var requiredStyles = HttpContext.Current.Items["RequiredStyles"] as IHtmlString;
        if (requiredStyles == null) HttpContext.Current.Items["RequiredStyles"] = requiredStyles = a;
        return null;
    }

    public static string RequireBundleScripts(this HtmlHelper html, string bundleName)
    {
        var a=System.Web.Optimization.Scripts.Render(bundleName);
        var requiredScripts = HttpContext.Current.Items["RequiredScripts"] as IHtmlString;
        if (requiredScripts == null) HttpContext.Current.Items["RequiredScripts"] = requiredScripts = a;
        return null;
    }

    public static HtmlString EmitRequiredBundleStyles(this HtmlHelper html)
    {
        var requiredStyles = HttpContext.Current.Items["RequiredStyles"] as IHtmlString;
        if (requiredStyles == null) return null;
        return MvcHtmlString.Create(requiredStyles.ToHtmlString()) ;
    }

    public static HtmlString EmitRequiredBundleScripts(this HtmlHelper html)
    {
        var requiredScripts = HttpContext.Current.Items["RequiredScripts"] as IHtmlString;
        if (requiredScripts == null) return null;
        return MvcHtmlString.Create(requiredScripts.ToHtmlString());
    }

    public static HtmlString EmitRequiredScripts(this HtmlHelper html)
    {
        var requiredScripts = HttpContext.Current.Items["RequiredScripts"] as List<ResourceInclude>;
        if (requiredScripts == null) return null;
        StringBuilder sb = new StringBuilder();
        foreach (var item in requiredScripts.OrderByDescending(i => i.Priority))
        {
            sb.AppendFormat("<script src=\"{0}\" type=\"text/javascript\"></script>\n", item.Path);
        }
        return new HtmlString(sb.ToString());
    }
    public class ResourceInclude
    {
        public string Path { get; set; }
        public int Priority { get; set; }
    }
}//end class
}// end namespace  

আংশিকভিউয়ের নমুনা: - @ এইচটিএমএল.রেকায়ারবান্ডেলস্টাইলস ("~ / বান্ডেল / ফাইলআপলোড / বুটস্ট্র্যাপ / বেসিকপ্লাসুআই / সিএসএস"); @ Html.RequireBundleScripts ( "~ / থোকায় থোকায় / fileupload / বুটস্ট্র্যাপ / BasicPlusUI / JS");

মাস্টারপেজে নমুনা: - @ এইচটিএমএল।


0

পৃষ্ঠায় পরে কোনও সামগ্রী (স্ক্রিপ্ট বা কেবল HTML) রেন্ডার করতে @using(Html.Delayed()){ ...your content... }উত্তর https://stackoverflow.com/a/18790222/1037948 থেকে এক্সটেনশনগুলি ব্যবহার করুন । অভ্যন্তরীণ Queueসঠিক ক্রম নিশ্চিত করা উচিত।


0

এই কার্যকারিতাটি ক্লায়েন্টডিপেন্ডেন্সি.কোর.এমভিসি.ডিএল-তেও প্রয়োগ করা হয়। এটি এইচটিএমএল সহায়কগুলি সরবরাহ করে: @ এইচটিএমএল.আরকিউয়ারসজেএস এবং @ এইচটিএমএল.রেন্ডারজেএসহির ()। নিউট প্যাকেজ: ক্লায়েন্টডিপেন্ডেন্সি-এমভিসি


0

এখানে প্রায়শই জিজ্ঞাসা করা প্রশ্নগুলির "এসপ নেটওয়্যার এমভিসি'র জন্য আংশিক দর্শন থেকে মূল দৃষ্টিভঙ্গি বা মূল বিন্যাসের ভিউতে কীভাবে বিভাগগুলি ইনজেক্ট করা যায়?" আপনি যদি "বিভাগ + আংশিক" কীওয়ার্ড দ্বারা কীওয়ার্ডগুলি দ্বারা স্ট্যাকওভারফ্লোতে অনুসন্ধান করেন, আপনি সম্পর্কিত প্রশ্নগুলির একটি বড় তালিকা পাবেন, এবং উত্তরগুলি দিয়েছেন তবে সেগুলির কোনওটিই রেজার ইঞ্জিন ব্যাকরণের মাধ্যমে আমার কাছে মার্জিত বলে মনে হয় না। সুতরাং আমি কেবল রেজার ইঞ্জিনটি একবার দেখে নিই দেখুন এই প্রশ্নের আরও ভাল কোনও সমাধান হতে পারে কিনা।

ভাগ্যক্রমে, আমি এমন কিছু জিনিস পেয়েছি যা আমার কাছে আকর্ষণীয় যে কীভাবে রেজার ইঞ্জিনটি ভিউ টেম্পলেট ফাইলের জন্য সংকলন করে (* .cshtml, * .vbhtml) does (আমি পরে ব্যাখ্যা করব), নীচে আমার সমাধানের কোডটি যা আমি মনে করি এটি যথেষ্ট সহজ এবং ব্যবহারে যথেষ্ট মার্জিত।

namespace System.Web.Mvc.Html
{
    public static class HtmlHelperExtensions
    {
        /// <summary>
        /// 确保所有视图,包括分部视图(PartialView)中的节(Section)定义被按照先后顺序追加到最终文档输出流中
        /// </summary>
        public static MvcHtmlString EnsureSection(this HtmlHelper helper)
        {
            var wp = (WebViewPage)helper.ViewDataContainer;
            Dictionary<string, WebPages.SectionWriter> sw = (Dictionary<string, WebPages.SectionWriter>)typeof(WebPages.WebPageBase).GetProperty("SectionWriters", Reflection.BindingFlags.NonPublic | Reflection.BindingFlags.Instance).GetValue(wp);
            if (!helper.ViewContext.HttpContext.Items.Contains("SectionWriter"))
            {
                Dictionary<string, Stack<WebPages.SectionWriter>> qss = new Dictionary<string, Stack<WebPages.SectionWriter>>();
                helper.ViewContext.HttpContext.Items["SectionWriter"] = qss;
            }
            var eqs = (Dictionary<string, Stack<WebPages.SectionWriter>>)helper.ViewContext.HttpContext.Items["SectionWriter"];
            foreach (var kp in sw)
            {
                if (!eqs.ContainsKey(kp.Key)) eqs[kp.Key] = new Stack<WebPages.SectionWriter>();
                eqs[kp.Key].Push(kp.Value);
            }
            return MvcHtmlString.Create("");
        }

        /// <summary>
        /// 在文档流中渲染指定的节(Section)
        /// </summary>
        public static MvcHtmlString RenderSectionEx(this HtmlHelper helper, string section, bool required = false)
        {
            if (helper.ViewContext.HttpContext.Items.Contains("SectionWriter"))
            {
                Dictionary<string, Stack<WebPages.SectionWriter>> qss = (Dictionary<string, Stack<WebPages.SectionWriter>>)helper.ViewContext.HttpContext.Items["SectionWriter"];
                if (qss.ContainsKey(section))
                {
                    var wp = (WebViewPage)helper.ViewDataContainer;
                    var qs = qss[section];
                    while (qs.Count > 0)
                    {
                        var sw = qs.Pop();
                        var os = ((WebViewPage)sw.Target).OutputStack;
                        if (os.Count == 0) os.Push(wp.Output);
                        sw.Invoke();
                    }
                }
                else if (!qss.ContainsKey(section) && required)
                {
                    throw new Exception(string.Format("'{0}' section is not defined.", section));
                }
            }
            return MvcHtmlString.Create("");
        }
    }
}

ব্যবহার : কোডটি ব্যবহার করাও বেশ সহজ, এবং এটি প্রায় একই শৈলীটি দেখতে সাধারণভাবে দেখায়। এটি নেস্টেড আংশিক দৃষ্টিতে যে কোনও স্তরকে সমর্থন করে। অর্থাত। আমার কাছে একটি ভিউ টেম্পলেট চেইন রয়েছে: _ভিউস্টার্ট.কোশটিএম-> লেআউট.সিএইচটিটিএম-> সূচিপত্র -shtml -> [শিরোনাম।

লেআউট.সিএসটিএমএলে, আমাদের রয়েছে:

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>@ViewBag.Title - @ViewBag.WebSetting.Site.WebName</title>
    <base href="@ViewBag.Template/" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1.0, user-scalable=0,user-scalable=no">
    <meta name="format-detection" content="telephone=no">
    <meta name="renderer" content="webkit">
    <meta name="author" content="Taro Technology Co.,LTD" />
    <meta name="robots" content="index,follow" />
    <meta name="description" content="" />
    <meta name="keywords" content="" />
    <link rel="alternate icon" type="@ViewBag.WebSetting.Site.WebFavIcon" href="@ViewBag.WebSetting.Site.WebFavIcon">
    @Html.RenderSectionEx("Head")
</head>
<body>
    @RenderBody()
    @Html.RenderSectionEx("Foot")
</body>
</html>

এবং ইনডেক্স.সিএসটিএমএলে, আমাদের রয়েছে:

@{
    ViewBag.Title = "首页";
}

@Html.Partial("head")
<div class="am-container-1">
    .......
</div>
@Html.Partial("foot")

এবং head.cshtml এ, আমাদের কোডটি থাকবে:

@section Head{
    <link rel="stylesheet" href="assets/css/amazeui.css" />
    <link rel="stylesheet" href="assets/css/style.css" />
}

<header class="header">
   ......
</header>
@Html.EnsureSection()

এটি foot.cshtml বা ad.cshtml তে একই রকম, আপনি এখনও সেগুলির মধ্যে প্রধান বা পাদদেশ বিভাগটি সংজ্ঞায়িত করতে পারেন, আংশিক ভিউ ফাইলের শেষে একবার @ এইচটিএমএল.ইনসুরসেকশন () কল করতে ভুলবেন না। এপ এমভিসি-র সাবজেক্ট ইস্যু থেকে মুক্তি পাওয়ার জন্য আপনার এটাই দরকার।

আমি কেবল আমার কোড স্নিপেটটি ভাগ করেছি যাতে অন্যরা এটি ব্যবহার করতে পারে। আপনি যদি এটি দরকারী বলে মনে করেন তবে আমার পোস্টটি রেট দিতে দ্বিধা করবেন না। :)

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