Стварэнне MVC памочнік для JavaScript/JQuery

Для новага праекту, я выкарыстоўваю JavaScript/JQuery набор для адлюстравання графікі ( http://www.highcharts.com </а>). Javascript код для кожнай старонкі прыкладна тое ж самае, так што я хацеў, каб цэнтралізаваць яго і зрабіць нешта шматразовае. Я выкарыстоўваю ASP.NET MVC для гэтага прыкладання, так што я шукаў, каб стварыць servercontrol з некаторымі наладамі якія будуць выводзіць JavaScript/JQuery код у арганізаваным парадку. Але я не ўпэўнены, пра тое, як зрабіць гэта ў хупавы спосаб. Вядома, я мог бы проста пайсці і пабудаваць доўгую радок і зрабіць што старонкі, але гэта здаецца даволі непрыгожа.

Так што я ў асноўным шукаю лепшыя на звычаі, як ператварыць кавалак JavaScript у servercontrol кіраванага. Я таксама хачу, каб ўключаць такія рэчы, як аўтаматычная прывязкі дадзеных да JSON вэб-сэрвісаў.

абнаўленне; Я стварыў мадэль, якую я хачу выкарыстоўваць для пабудовы графікаў. Ён змяшчае такія рэчы, як восі этыкеткі, назву дыяграмы і таму падобнае.

Зараз у маёй старонцы, у мяне ёсць код JQuery, які змяшчае такія рэчы, як гэта:

title: { text: '<%: Model.Title %>' },

ўсталяваць розныя ўласцівасці дыяграмы. Але я разумею, што гэта не добрая практыка, я проста не ведаю, на што. У прыведзеным вышэй прыкладзе, я хачу зрабіць рэчы, як дадаць назву ўласцівасці, калі ён усталяваны ў маёй мадэлі, але цалкам выключыць яго, калі гэта не (што не адбываецца цяпер). Я магу атрымаць там, дадаўшы шмат, калі/яшчэ рэчы, але гэта не збіраецца рабіць рэчы папрыгажэла. Таму мне цікава, гучна кастрыраваны баран з пабудовы кода

jQuery не тое, што павінна быць зроблена ў класе замест.

3

3 адказы

У MVC DisplayTemplates або частковы выгляд больш аналагічны кіраванне, чым HtmlHelpers. Калі яго проста скрыпт, які не патрабуе якога-небудзь дадатковы пошуку дадзеных або таму падобнага, я б проста выкарыстоўваць Частковы выгляд і спасылку з @ Html.Partial </кодам>. Калі ён мае дадатковыя функцыянальныя магчымасці пошуку ў/бяспеку/дадзеных, то я б з дзіцем дзеянні (гэта значыць. Стварыць ChartController і спасылкі з @ Html.Action ( «ActionName», «Дыяграма» , PARAMS) . Калі яго заснавана на ўласцівасці ў вашай мадэлі, то я б з DisplayTemplate.

Калі яго цалкам на бок кліента, хоць толькі з запытам дадзеных, я б пэўна рабіць тое, што рэкамендую Маркес і проста ёсць файл .js.

1
дададзена

Я б рэкамендаваў змясціць JavaScript у .js файле і проста спасылацца на яго з дапамогай тэга сцэнара ад галоўнага віду, старонка прагляду або кіравання карыстальнік гледжання MVC было патрэбна. Ёсць некалькі пераваг размяшчэння JavaScript ў асобным файле, і гэта лічыцца добрай практыкай. Кэшаванне ў яваскрипте кантэнту ў браўзэры дасць магчымасць павысіць прадукцыйнасць і зменшыць выкарыстанне прапускной здольнасці - і гэта будзе прасцей для адладкі JavaScript з падпальшчык або любым іншым адладчыкам JavaScript.

1
дададзена
Добра, гучыць як добрая ідэя. Але мне патрэбен спосаб, каб аб'яднаць выхад у chartcontrols вырабляць з дадзенымі, якія я кармлю яго. Chartcontrol паўторна выкарыстоўваецца на некалькіх старонках, таму я хачу, каб зрабіць яго наладжвальным кантролерам. Напрыклад, на старонцы, дзе вось у ўяўляе колькасць карыстальнікаў, я хачу, каб мець магчымасць распавесці сваю мадэль, што вось у ліку карыстачоў і проста выхад, што ў графе. Я магу зрабіць гэта шляхам прадастаўлення мадэлі рэчы troughout кода JQuery, але я не зусім упэўнены, што гэта шлях тут.
дададзена аўтар Jasper, крыніца

Я працаваў на з адкрытым зыходным кодам MVC Html Helper для Highcharts . Гэта ўсё яшчэ ў стадыі распрацоўкі, але я на самой справе падабаецца вынік, таму я спадзяюся, што гэта можа быць карысна для вас нейкім чынам. Гэта прыклад таго, што вы робіце з Highcharts MVC:

@(
    Html.Highchart("myChart")
        .Title(this.Model.Title)
        .WithSerieType(ChartSerieType.Line)
        .AxisX("Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec")
        .AxisY(this.Model.MyChartAxisTitle)
        .Series(
            new Serie("iPad", new int?[] { 0, 0, 0, 0, 0, 0, 16, 20, 40, 61, 100, 120 }),
            new Serie("MacBook", new int?[] { 616, 713, 641, 543, 145, 641, 134, 673, 467, 859, 456, 120 }),
            new Serie("iPhone", new int?[] { 10, 45, 75, 100, null, 546, 753, 785, 967, 135, 765, 245 })
        ).ToHtmlString()
)
0
дададзена