मैं ऑर्चर्ड संपादक टेम्प्लेट में दिनांक फ़ील्ड के रूप में रेंडर कैसे कर सकता हूं?

Question

मैंने एक सामग्री भाग के साथ एक मॉड्यूल बनाया जिसमें कुछ फ़ील्ड्स दिनांक के रूप में हैं। जब मैं संपादक टेम्प्लेट में इन दिनांक फ़ील्ड को रेंडर करता हूं, तो मैं चाहता हूं कि उन्हें डेटापिक टेक्स्टबॉक्स के रूप में प्रस्तुत किया जाए, जब मैं व्यवस्थापक पैनल का उपयोग करके दिनांक समय फ़ील्ड के साथ एक कस्टम सामग्री प्रकार बनाता हूं।

वहाँ एक आकृति या smth है जैसे कि उन्हें डेटर्स के रूप में प्रदान किया गया है और आवश्यक jquery स्क्रिप्ट को स्वचालित रूप से जोड़ा जाना है, या क्या मुझे टेक्स्ट बॉक्स को मैन्युअल रूप से प्रस्तुत करना होगा और आवश्यक js स्क्रिप्ट को जोड़ना होगा?

मैं ऑर्चर्ड 1.8 का उपयोग कर रहा हूं

orchardcms

1

Deniz 26 नवम्बर 2015, 01:14

Answer 1

यदि आप एक ही यूआई रखना चाहते हैं तो ऑर्चर्ड प्रदान करें आपको केवल अपने विचार के नीचे शैलियों और लिपियों को शामिल करने की आवश्यकता है:

Style.Require("jQueryCalendars_Picker");
Style.Require("jQueryUI_Calendars_Picker");
Style.Require("jQueryTimeEntry");
Style.Require("jQueryDateTimeEditor");
///////////////////////////////////

///////
Script.Require("jQueryCalendars_All").AtFoot();
Script.Require("jQueryCalendars_Picker_Ext").AtFoot();
Script.Require("jQueryTimeEntry").AtFoot();

और नीचे दी गई स्क्रिप्ट को अपनी जावास्क्रिप्ट फ़ाइल में जोड़ें:

 $("#DateSelector").calendarsPicker({
        showAnim: "",
        renderer: $.extend({}, $.calendarsPicker.themeRollerRenderer, {
            picker: "<div {popup:start} id='ui-datepicker-div'{popup:end} class='ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all{inline:start} ui-datepicker-inline{inline:end}'><div class='ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-all'>{link:prev}{link:today}{link:next}</div>{months}{popup:start}{popup:end}<div class='ui-helper-clearfix'></div></div>",
            month: "<div class='ui-datepicker-group'><div class='ui-datepicker-month ui-helper-clearfix'>{monthHeader:MM yyyy}</div><table class='ui-datepicker-calendar'><thead>{weekHeader}</thead><tbody>{weeks}</tbody></table></div>"
        })
    });

या इसे कस्टमाइज़ करें जैसा कि आप किसी भी समय उपयोगकर्ता द्वारा UI के साथ इंटरैक्ट करने के लिए दिखाना चाहते हैं

1

Shahin b 26 नवम्बर 2015, 07:00

Answer 2

दिनांक फ़ील्ड के समान संपादक दृश्य का उपयोग करने के लिए आप Orchard के DateTimeEditor वर्ग का उपयोग कर सकते हैं, और विभिन्न विकल्पों (दिनांक संपादक, समय संपादक) पर नियंत्रण कर सकते हैं। इस तरह आप jquery UI पुस्तकालयों सहित बाग के अद्यतन को भी लेते हैं।

ViewModel:

public class MyEditViewModel {
    public DateTimeEditor DateTimeEditor { get; set; }
}

आपके ड्राइवर में (IDateLocalizationServices का उपयोग करें):

public class MyPartDriver : ContentPartDriver<MyPart> {

    private readonly IDateLocalizationServices _dateLocalizationServices;
    public SchedulingPartDriver(IDateLocalizationServices dateLocalizationServices) {
        _dateLocalizationServices = dateLocalizationServices;
    }

    protected override DriverResult Editor(MyPart part, dynamic shapeHelper) {
        return ContentShape("Parts_MyPart_Edit", () => {
            var viewModel = new MyEditViewModel {
                DateTimeEditor = new DateTimeEditor {
                    ShowDate = true, // if date editor should be shown
                    ShowTime = true, // if time editor should be shown
                    Date = _dateLocalizationServices.ConvertToLocalizedDateString(part.MyDate),
                    Time = _dateLocalizationServices.ConvertToLocalizedTimeString(part.MyDate)
                };
            };
        });
    }

    protected override DriverResult Editor(MyPart part, IUpdateModel updater, dynamic shapeHelper) {
        // same as above, probably put it in a separate method to build the viewmodel
        var viewModel = new MyEditViewModel {..};

        if(updater.TryUpdateModel(viewModel, Prefix, null, null) {
            part.MyDate = _dateLocalizationServices.ConvertFromLocalizedString(viewModel.DateTimeEditor.Date);
        }

        return Editor(part, shapeHelper);
    }
}

और फिर आपके दृश्य / EditorTemplates / Parts / MyPart.cshtml में:

@model MyNameSpace.ViewModels.MyEditViewModel

@Html.EditorFor(m => m.DateTimeEditor) // this will render the editor for the date/time

2

devqon 12 मई 2017, 06:43

मैं ऑर्चर्ड संपादक टेम्प्लेट में दिनांक फ़ील्ड के रूप में रेंडर कैसे कर सकता हूं?

2 जवाब

संबंधित सवाल

नए सवाल

orchardcms