Yii में प्रसंग-संवेदी रूप

फ्रेमवर्क के साथ काम करते समय, आपको हमेशा मुख्य कार्यक्षमता खुद बनाना होगा, अधिमानतः फ्रेमवर्क की क्षमताओं का उपयोग करके (क्यों तब हमें इसकी आवश्यकता है)। जैसा कि आप शीर्षक से देख सकते हैं, हम Yii में संदर्भ-संवेदनशील रूपों के बारे में बात करेंगे। लेख एक समान रूप के कार्यान्वयन का वर्णन करता है जो एक मोडल विंडो का उपयोग करता है। मुझे उम्मीद है कि यह विकल्प किसी के लिए उपयोगी होगा।

आगे देखते हुए, मैं कहता हूं कि परिणाम एक ऐसा क्षेत्र होना चाहिए, एक ड्रॉप-डाउन मेनू और आवश्यक डेटा का चयन करने के लिए दाईं ओर एक बटन होना चाहिए।



संदर्भ के प्रति संवेदनशील चयन बॉक्स:



चयन करने के बाद:



मोडल विंडो विकल्प क्यों चुना गया? यह आपको वांछित आइटम के चयन को सरल बनाने की अनुमति देता है। एक मोडल विंडो में, आप CGridView प्रदर्शित कर सकते हैं, जबकि आप डेटा को सॉर्ट, खोज और फ़िल्टर कर सकते हैं, जो बहुत सुविधाजनक है यदि आपको बड़ी संख्या में तत्वों में से चुनना है।
तो, इस Yiichnitsa की तैयारी के लिए सामग्री:

• एक य
• NLSClientScript एक्सटेंशन
• स्वाद के लिए बूटस्ट्रैप ( Yii के लिए विस्तार )

अब, धैर्य रखें और खाना बनाना शुरू करें।

मान लें कि हमारे पास menuController.php कंट्रोलर, व्यू फाइल _form.php और Menu.php मॉडल है। मैं इस बात पर ध्यान नहीं दूंगा कि कौन कौन है, यह सब एक मानक है, स्वचालित रूप से जनरेट किया गया कोड Gii , Gee है।

मॉडल (Menu.php)

सबसे पहले, हम स्पष्ट करेंगे कि मॉडल कैसे काम करता है। हम मानते हैं कि हमारे पास डेटा प्रकार और आईडी का एक गुच्छा है, जो डेटा प्रकार के साथ जुड़ा हुआ है। मॉडल में (डेटाबेस में भी), प्रकार और data_id फ़ील्ड मौजूद होना चाहिए, दोनों पूर्णांक। सुविधा के लिए, मॉडल को लोड करते समय, हम उस ऑब्जेक्ट का नाम लोड करेंगे, जिसे वह संदर्भित करता है (ऑब्जेक्ट को संपादित करते समय आवश्यक है)। मान लें कि डेटा_नाम फ़ील्ड में है। आइए afterFind () फ़ंक्शन में आवश्यक धोखाधड़ी की जांच करें। हम डेटा प्रकारों की सूची को और अधिक गतिशील बनाते हैं। हम कक्षा में एक स्थिर सरणी को परिभाषित करेंगे, इसलिए यदि हमें प्रकार के विकल्पों का विस्तार या संकीर्ण करने की आवश्यकता है, तो हम केवल मॉडल वर्ग को संपादित करेंगे।
क्योंकि चूंकि हम ActiveRecord का उपयोग करते हैं, वास्तव में, आपको केवल एक विशेष डेटा प्रकार के साथ काम करने के लिए मॉडल का नाम और दृश्य जानना होगा।

static $types = array( 1 => array("name" => "", "model" => "Pages", "view" => "pages_grid"), 2 => array("name" => "", "model" => "Docs", "view" => "docs_grid"), 3 => array("name" => "", "model" => "Cats", "view" => "cats_grid"), ); public static function getSimpleTypes() { //   .   DropDownList $st = array(); foreach (Menu::$types as $key => $value) $st[$key] = $value["name"]; return $st; } var $data_name; public function afterFind() { $dataModel = $types[$this->type]['model']::model()->findByPk($this->data_id); $this->data_name = $dataModel->title; //   $data_name    parent::afterFind(); } 

यह मॉडल के विचार पर निष्कर्ष निकालता है।

फ़ॉर्म देखें (_form.php)

हम अपने फॉर्म की व्यू फाइल _form.php को देखते हैं

 <!--    --> <?php $form=$this->beginWidget('bootstrap.widgets.TbActiveForm',array( 'id'=>'menu-form', 'enableAjaxValidation'=>false, 'type' => 'horizontal', )); ?> <!--       --> <?php echo $form->errorSummary($model);?> <?php echo $form->textFieldRow($model,'name');?> <!--  ,    data_id --> <?php echo $form->textField($model,'data_id',array('class'=>'hide')); ?> <!--        bootstrap--> <div class="control-group"> <div class="control-label"> <?=$form->labelEx($model,'type')?> </div> <div class="controls"> <div class="input-append"> <?php echo $form->dropDownList($model,'type',Menu::getSimpleTypes());?> <button class="btn" id="data-select-btn" data-loading-text="..." type="button"><i class="icon-list"></i></button> </div> </div> </div> <!--   ,    .     Update,   ,  --> <div id="data-info" class="alert alert-success controls <?if($model->isNewRecord):?>hide<?endif;?>"> <i class="icon-file"></i> <span class="info"> <?if(!$model->isNewRecord) echo $model->data_name?> </span> </div> <!--  /--> <div class="form-actions"> <?php $this->widget('bootstrap.widgets.TbButton', array( 'buttonType'=>'submit', 'type'=>'primary', 'label'=>$model->isNewRecord ? 'Create' : 'Save', )); ?> </div> <?php $this->endWidget(); ?> <!--      --> <?php $this->beginWidget('bootstrap.widgets.TbModal', array('id'=>'dataModal')); ?> <div class="modal-header"> <a class="close" data-dismiss="modal">×</a> <h4><?=Yii::t("menu", " ")?></h4> </div> <div class="modal-body"></div> <div class="modal-footer"> <?php $this->widget('bootstrap.widgets.TbButton', array( 'label'=>Yii::t("menu", ""), 'url'=>'#', 'htmlOptions'=>array('data-dismiss'=>'modal'), )); ?> </div> <?php $this->endWidget(); ?> <script> //       function selectData(id, name) { $("#Menu_data_id").val(id); $("#data-info .info").html(name); $("#data-info").show(); $('#dataModal').modal("hide"); } //  data_id     $('#Menu_type').change(function(){ $("#Menu_data_id").val(""); $("#data-info").hide(); }) //         ,   AJAX $('#data-select-btn').click(function(){ var buttn = this; $(buttn).button('loading'); $.ajax({ url: "<?php echo $this->createAbsoluteUrl('menu/loadData') ?>", cache: false, data: "type="+$("#Menu_type").val(), success: function(html){ $(".modal-body").html(html); $(buttn).button('reset'); $('#dataModal').modal().css({ width: 'auto', 'margin-left': function () { return -($(this).width() / 2); }, }); } }); }) </script> 

दरअसल यह पूरी फॉर्म फाइल है। यहाँ मुख्य तत्व AJAX डेटा अनुरोध के लिए हमारे क्षेत्र और कार्य हैं।
जैसा कि आप देख सकते हैं, डेटा अधिग्रहण फ़ंक्शन मेनू / लोडडैट एक्शन को एक्सेस करता है । आइए देखें कि वह क्या करता है:

नियंत्रक (menuController.php)

  public function actionLoadData($type) { $model_name = Menu::$types[$type]['model']; $model = new $model_name('search'); //      if(isset($_GET[$model_name])) //          $model->attributes=$_GET[$model_name]; $this->renderPartial(Menu::$types[$type]['view'],array( 'model'=>$model, ), false, true); //   $processOutput = true,      . } 

यह ध्यान दिया जाना चाहिए कि आपको रेंडरपार्टियल फ़ंक्शन के लिए पैरामीटर $ processOutput = true सेट करने की आवश्यकता है, अन्यथा दृश्य फ़ाइल में विजेट्स से जुड़ी स्क्रिप्ट लोड नहीं होंगी।
यह एक बहुत ही महत्वपूर्ण बिंदु को स्पष्ट करने के लिए भी आवश्यक है, जब $ processOutput पैरामीटर सेट करते हैं, तो सभी फाइलें लोड की जाएंगी, जिनमें वे पहले से ही मुख्य पृष्ठ पर जुड़े हुए हैं, जो उदाहरण के लिए, JQuery के मामले में बहुत महत्वपूर्ण है। इसलिए, मैं आपको NLSClientScript एक्सटेंशन स्थापित करने की सलाह देता हूं, यह सुनिश्चित करेगा कि सभी फाइलें एक बार जुड़ी हुई हैं।

मोडल विंडो के लिए फ़ाइल देखें (docs_grid.php)

फ़ाइलों को नियंत्रक के समर्पित फ़ोल्डर में संग्रहीत किया जाना चाहिए, अर्थात हमारे मामले में यह / संरक्षित / विचार / मेनू होगा
अब हम मोडल विंडो के लिए व्यू फाइल्स में से एक का विश्लेषण करेंगे। आप डेटा का चयन करने के लिए किसी भी सुविधाजनक दृश्य का उपयोग कर सकते हैं, मुख्य बात यह है कि यह मॉडल ऑब्जेक्ट के माध्यम से काम करता है। मुझे CGridView पसंद है क्योंकि इसमें आपके लिए आवश्यक सभी चीजें हैं: खोज, पृष्ठांकन और छंटाई।

 $this->widget('bootstrap.widgets.TbGridView',array( 'id'=>'docs-grid', 'dataProvider'=>$model->search(), 'filter'=>$model, 'columns'=>array( 'id', 'title', 'updated', array( 'class'=>'CButtonColumn', 'template' => "{insert}", 'buttons' => array( "insert" => array( 'label' => "", 'options' => array( "class" => "btn btn-mini btn-success", "onclick" => 'selectData($(this).parent().parent().children(":nth-child(1)").text(),$(this).parent().parent().children(":nth-child(2)").text());', ) ), ) ), ), )); 

तत्व चयन बटन के साथ एक भी ग्रिड नहीं है। उदाहरण बूटस्ट्रैप ग्रिड का उपयोग करता है, लेकिन आप मानक CGridView का उपयोग कर सकते हैं।
लेकिन एक तरकीब है। जैसा कि आपने देखा, एक सादे स्क्रिप्ट तत्व चयन बटन पर लटका हुआ है, तालिका से तत्व की आईडी और शीर्षक को फाड़ रहा है। दुर्भाग्य से, ग्रिड व्यू विजेट एकल रिकॉर्ड के डेटा पर काम करने की अनुमति नहीं देता है। इसलिए, हमें इस तरह से आवश्यक आईडी और शीर्षक प्राप्त करना होगा, जो कि दृश्य फ़ाइल _form.php में वर्णित चयन डेटा फ़ंक्शन को पास किए जाते हैं ।

बस इतना ही। एक नया डेटा प्रकार जोड़ने के लिए, यह मेनू में निर्मित सरणी में एक और पंक्ति जोड़ने के लिए पर्याप्त है। मॉडल और लिखने या उत्पन्न, Gii का उपयोग करते हुए, नए प्रकार के लिए ActiveRecord मॉडल।