วิธีการจัดรูปแบบมุมมองที่เปิดเผย?


12

ฉันได้สร้างมุมมองที่มีตัวกรองที่เปิดเผยจำนวนหนึ่ง แต่มันดูน่าเกลียดทีเดียว

ป้อนคำอธิบายรูปภาพที่นี่

ฉันต้องการปรับปรุงชุดรูปแบบรวมถึงการตัดทั้งชุดในชุดฟิลด์รวมถึงการจัดกลุ่มองค์ประกอบอื่น ๆ (เช่นจับคู่ข้อมูลที่เผยแพร่และอัปเดตแล้ว) แต่ไม่แน่ใจว่าจะทำอย่างไร

ฉันพยายามที่จะ var_dump ฟอร์ม แต่ดูเหมือนว่าจะดำเนินต่อไปตลอดกาลและเบราว์เซอร์ของฉันล็อคดังนั้นฉันจึงไม่สามารถเรียนรู้อะไรเกี่ยวกับแบบฟอร์มนั้นได้อย่างง่ายดาย

ฉันยังพยายามวางฟอร์มเป็นเด็ก fieldset ในอีกรูปแบบ แต่รับข้อมูล ID ของฟอร์มทั้งหมดและอื่น ๆ ที่พิสูจน์แล้วว่าเป็นปัญหา (แม้ว่าฉันได้รับการจัดแต่งทรงผม fieldset)

ใครมีพอยน์เตอร์บ้าง?

ปรับปรุง:

ฉันคัดลอกทับเทมเพลตจากโมดูลไปยังไดเรกทอรีธีมของเว็บไซต์และเริ่มต้น

<fieldset>
    <legend>Filters</legend>

    <div class="views-exposed-form">
        <div class="views-exposed-widgets clear-block">
            <?php foreach($widgets as $id => $widget): ?>
                <div class="views-exposed-widget">
                    <?php if (!empty($widget->label)): ?>
                        <label for="<?php print $widget->id; ?>">
                            <?php print $widget->label; ?>
                        </label>
                    <?php endif; ?>
                    <?php if (!empty($widget->operator)): ?>
                        <div class="views-operator">
                            <?php print $widget->operator; ?>
                        </div>
                    <?php endif; ?>
                    <div class="views-widget">
                        <?php print $widget->widget; ?>
                    </div>
                </div>
            <?php endforeach; ?>
            <div class="views-exposed-widget">
                <?php print $button ?>
            </div>
        </div>
    </div>
</fieldset>

ฉันดูเหมือนจะไม่สามารถหาวิธีจับคู่เขตข้อมูลวันที่ - ฉันต้องแก้ไขคุณสมบัติวิดเจ็ตอย่างใดอย่างหนึ่งเพื่อให้สามารถห่อเป็น HTML ได้ (การใช้ hook_form_alter ไม่ทำงานเนื่องจากมีการเพิ่ม #prefix และ #suffix ลงใน$widget->widgetนั้น ทำลายเอาท์พุท)

คำตอบ:


22

รูปแบบที่เปิดเผยของผู้เข้าชมนั้นยากเพราะมันไม่ได้ทำงานเหมือนในรูปแบบส่วนใหญ่และใช้กลไกฉลากของตัวเอง ดังนั้นคุณไม่สามารถใช้form_alterเบ็ดเพื่อเพิ่ม#prefixและ#suffixองค์ประกอบ แต่การใช้THEME_preprocess_views_exposed_formคุณสามารถสร้างกลไกต่อท้าย / คำนำหน้าของคุณเอง:

function THEME_preprocess_views_exposed_form(&$variables) {
  if ($variables['form']['#id'] == 'views-exposed-form-VIEWNAME-DISPLAYID') {
    foreach ($variables['widgets'] as $id => &$widget) {
      switch ($id) {
        case 'first_date_id':
          $widget->prefix = '<div class="date-widgets-wrapper">';
          break;
        case 'last_date_id':
          $widget->suffix = '</div>';
          break;
      }
    }
  }
}

และในไฟล์เทมเพลต

<fieldset>
    <legend>Filters</legend>

    <div class="views-exposed-form">
        <div class="views-exposed-widgets clear-block">
            <?php foreach($widgets as $id => $widget): ?>
                <?php if (!empty($widget->prefix)) print $widget->prefix; ?>
                <div class="views-exposed-widget">
                    <?php if (!empty($widget->label)): ?>
                        <label for="<?php print $widget->id; ?>">
                            <?php print $widget->label; ?>
                        </label>
                    <?php endif; ?>
                    <?php if (!empty($widget->operator)): ?>
                        <div class="views-operator">
                            <?php print $widget->operator; ?>
                        </div>
                    <?php endif; ?>
                    <div class="views-widget">
                        <?php print $widget->widget; ?>
                    </div>
                </div>
                <?php if (!empty($widget->suffix)) print $widget->suffix; ?>
            <?php endforeach; ?>
            <div class="views-exposed-widget">
                <?php print $button ?>
            </div>
        </div>
    </div>
</fieldset>

7

คุณสามารถคัดลอก views-exposed-form.tpl.php จาก sites / all / modules / views / theme ไปยังพา ธ ธีมของคุณเพื่อลบล้างเทมเพลต


นอกจากนี้คุณยังสามารถแทนที่สำหรับมุมมองเฉพาะที่มีรูปแบบเหมือนviews-exposed-form--view_id.tpl.phpหรือviews-exposed-form--view_id--display_id.tpl.php, ข้อมูลเพิ่มเติม
user56reinstatemonica8


3

คุณควรตรวจสอบสิ่งที่อยู่ในform['#theme']รายการ วิธีที่ดีกว่าในการทำเช่นนี้ (ดีกว่าvar_dump()) จะใช้dsm($form)หรือแม้กระทั่งkpr($form)ฟังก์ชั่นเหล่านี้จะมีประโยชน์หลังจากที่คุณติดตั้งโมดูล devel ( http://drupal.org/project/devel ) form['#theme']ควรเป็นอาร์เรย์ขององค์ประกอบประมาณ 7 องค์ประกอบเหล่านี้เป็นชื่อของ hooks ธีมที่เรียกว่าเมื่อมีการแสดงผลแบบฟอร์มนี้ คุณสามารถใช้พวกเขาเพื่อนำวิธีการของคุณมาใช้ในการสร้างธีม

views_exposed_form__VIEW_NAME__DISPLAY_IDหนึ่งในรายการที่จะถูกเรียกว่า

ในโมดูลของคุณ (ถ้าคุณมี) ควรจะมีการใช้งาน hook_theme ()

function MYMODULE_theme($existing, $type, $theme, $path) {
  return array(
    'views_exposed_form__VIEW_NAME__DISPLAY_ID' => array(
      'function' => 'my_exposed_form_theme_function',
      'render element' => 'form',
    )
  );
}

// somwhere later in code

function my_exposed_form_theme_function($vaiables) {
  //$vaiables['form'] contains a form array
  //to display a form element call drupal_render($vaiables['form']['some element'])
  //don't forget to call drupal_render($form) 
  //after you are done with rendering individual elements
  //
  //you can use template_preprocess_views_exposed_form() from 
  // views/theme/theme.inc as an example

  return "concatenated results of multiple drupal_render() calls";
}

2

ในสถานการณ์ก่อนหน้านี้ฉันได้ใช้ Hook_form_alter () เพื่อเพิ่มคำนำหน้าและคำต่อท้ายเพื่อสร้างองค์ประกอบเพื่อตัดคำเหล่านั้นใน div ซึ่งสามารถจัดรูปแบบได้ ไม่แน่ใจเกี่ยวกับการห่อในชุดฟิลด์แม้ว่า

เช่น.

$form['submitted']['full_name']['#prefix'] = '<div class="background">';        
$form['submitted']['message']['#suffix'] = '</div>';

1

ใช้ hook_form_FORM_ID_alter ของ Drupal เพื่อปรับเปลี่ยนแบบฟอร์ม นี่คือสิ่งที่แก้ไขปัญหาของฉันในการนำอักขระ£ไปยังฟิลด์ราคาของฉัน (ใส่ไว้ในโมดูลที่กำหนดเองของคุณ):

function THEME_form_views_exposed_form_alter(&$form, &$form_state, $form_id) {
   // check this is the right form
   if ($form['#theme'][0] == 'REPLACE_THIS') {
      // add the prefix
      $form['price']['min']['#prefix'] = "£";
   }
}


0

ในหน้าแก้ไขของมุมมองที่เราสามารถตรวจสอบข้อมูลชุดรูปแบบ (มุมล่างขวา) มันให้ข้อมูลเกี่ยวกับไฟล์เทมเพลตที่ใช้โดย Drupal เพื่อแสดงส่วนต่าง ๆ ของมุมมองบนหน้าจอ โดยค่าเริ่มต้นจะใช้ไฟล์เทมเพลตจากโมดูลมุมมอง (ภายในโฟลเดอร์ชุดรูปแบบ) แต่ในกรณีที่เราต้องการแก้ไขวิธีการแสดงมุมมองเราสามารถแทนที่ไฟล์เทมเพลตเหล่านั้นด้วยไฟล์เทมเพลตที่กำหนดเองที่เราสามารถใส่ไว้ใน โฟลเดอร์ธีมที่กำหนดเองของตัวเอง (หรือธีมที่จะใช้ในการแสดงมุมมองนี้)

ข้อมูลชุดรูปแบบนี้แสดงให้เราเห็นถึงวิธีการตั้งชื่อไฟล์ตามลำดับชั้น (หรือขอบเขตของผลกระทบของไฟล์เทมเพลตที่คุณกำลังจะแทนที่เทมเพลตมุมมองของตัวเอง)

ตอนนี้ข้อมูลชุดรูปแบบนี้อาจไม่แสดงไฟล์เทมเพลตทั้งหมดที่มุมมองใช้เพื่อแสดงมุมมองนี้โดยเฉพาะ

ดังนั้นไปที่ sites / ทั้งหมด / modules / views / theme และคัดลอก views-exposed-form.tpl.php (เพราะในกรณีนี้เราต้องการแทนที่ค่าเริ่มต้นสำหรับการเรนเดอร์ตัวกรอง!) และวางไว้ในโฟลเดอร์ธีมของคุณเอง ตอนนี้คุณต้องทำตามวิธีการเดียวกันเพื่อควบคุมเอฟเฟกต์ของไฟล์เทมเพลตที่สำคัญที่คุณใส่ไว้ในโฟลเดอร์ธีมของคุณเองโดยเปลี่ยนชื่อใหม่ เช่นมุมมองที่เปิดเผย - แบบฟอร์มชื่อมุมมองของคุณ name.tpl.php (คุณจะเข้าใจระบบการตั้งชื่อโดยดูที่หัวข้อ: ข้อมูลในหน้าแก้ไขของมุมมอง)

ตอนนี้คุณสามารถเพิ่ม css ให้กับแต่ละวิดเจ็ต (สร้างโดยตัวจัดการตัวกรอง) ในไฟล์เทมเพลตนี้และการตั้งค่าเหล่านั้นจะถูกนำไปใช้กับตัวกรอง

เยี่ยมชมhttp://eureka.ykyuen.info/2011/07/25/drupal-theme-the-exposed-filter-in-views/

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.