1

Codeigniter で書かれたサイトを変更する必要がありますが、専門家ではありません。

私がやりたいことの 1 つは、フォームの選択コントロールを変更して、写真を含むドロップダウン リストにms-dropdownを使用することです。

ただし、Codeigniter フォーム ヘルパーに各オプションの ID と値以外のパラメーターをレンダリングさせる方法がわかりません。この場合、ms-dropdown を機能させるには、各オプションでdata-image="..."もレンダリングする必要があります。

現在のコードは次のようになります。

$dropdown = array(
'name'=>'MyDropDown', 
'options' => array('Op1'=>'First Option', 'Op2' =>'Second Option')
);

echo form_dropdown($dropdown['name'],$dropdown['options']);

これは次のようにレンダリングされます

<select name="MyDropDown">
<option value='Op1'>First Option</option>
<option value='Op2'>Second Option</option>
</select>

Codeigniter をレンダリングさせる方法はありますか

<select name="MyDropDown">
<option value='Op1' data-image="filepath1">First Option</option>
<option value='Op2'  data-image="filepath2">Second Option</option>
</select>
4

3 に答える 3

2

できません。ID などの他の属性を受け入れるには、CI のフォーム ヘルパーを拡張し、form_dropdown を変更する必要があります。

ヘルパーを拡張する必要があります。

ネイティブ フォーム ヘルパーを拡張するには、 application/helpers/MY_form_helper.phpという名前のファイルを作成し、関数を追加またはオーバーライドします。

オーバーライドしたい場合function form_dropdown

関数を好きなように書くだけですMY_form_helper.php

ここに基本関数があります

if ( ! function_exists('form_dropdown'))
{
    function form_dropdown($name = '', $options = array(), $selected = array(), $extra = '')
    {
        if ( ! is_array($selected))
        {
            $selected = array($selected);
        }

        // If no selected state was submitted we will attempt to set it automatically
        if (count($selected) === 0)
        {
            // If the form name appears in the $_POST array we have a winner!
            if (isset($_POST[$name]))
            {
                $selected = array($_POST[$name]);
            }
        }

        if ($extra != '') $extra = ' '.$extra;

        $multiple = (count($selected) > 1 && strpos($extra, 'multiple') === FALSE) ? ' multiple="multiple"' : '';

        $form = '<select name="'.$name.'"'.$extra.$multiple.">\n";

        foreach ($options as $key => $val)
        {
            $key = (string) $key;

            if (is_array($val) && ! empty($val))
            {
                $form .= '<optgroup label="'.$key.'">'."\n";

                foreach ($val as $optgroup_key => $optgroup_val)
                {
                    $sel = (in_array($optgroup_key, $selected)) ? ' selected="selected"' : '';

                    $form .= '<option value="'.$optgroup_key.'"'.$sel.'>'.(string) $optgroup_val."</option>\n";
                }

                $form .= '</optgroup>'."\n";
            }
            else
            {
                $sel = (in_array($key, $selected)) ? ' selected="selected"' : '';

                $form .= '<option value="'.$key.'"'.$sel.'>'.(string) $val."</option>\n";
            }
        }

        $form .= '</select>';

        return $form;
    }
}

この部分を編集する必要があります。

foreach ($options as $key => $val)
{
    $key = (string) $key;

    if (is_array($val) && ! empty($val))
    {
        $form .= '<optgroup label="'.$key.'">'."\n";

        foreach ($val as $optgroup_key => $optgroup_val)
        {
            $sel = (in_array($optgroup_key, $selected)) ? ' selected="selected"' : '';

            $form .= '<option value="'.$optgroup_key.'"'.$sel.'>'.(string) $optgroup_val."</option>\n";
        }

        $form .= '</optgroup>'."\n";
    }
    else
    {
        $sel = (in_array($key, $selected)) ? ' selected="selected"' : '';

        $form .= '<option value="'.$key.'"'.$sel.'>'.(string) $val."</option>\n";
    }
}

ご覧のとおり、オプションの 値属性のみが関数によって設定されます。このコードを編集して、必要なことを行うことができます。

試してみてください。できなかったら教えてください。お手伝いしますが、まずは試してみてください :)

于 2013-08-28T11:41:50.547 に答える
0

次のようなことを検討してください。

<script type="text/javascript">
    var filepath = <?=json_encode($dropdown['filepath'])?>;
</script>

$dropdown['filepath']オプション値をキーとして使用し、ファイルパスを値として保存します。filepath[$(this).val()]その後、イベント時に簡単にアクセスできますchange。

出力例:

<script type="text/javascript">
    var filepath = { 'Op1' : 'filepath1', 'Op2' : 'filepath2' };

    $('select').bind('change', function() {
        console.log(filepath[$(this).val()]);
    });
</script>

私は属性の使用が大好きdata-ですが、目標を達成するための他の方法を忘れてはなりません。

于 2013-08-28T09:57:39.883 に答える
0

誰でも役立つ場合は、JQuery を使用して回避策を見つけました。

ページの準備ができたら各オプション フィールドにdata-image属性を適用し、その後 msDropdown 関数を呼び出す JavaScript 関数を作成しました。

function PiccifyShowDropdown(){

var Diagrams = new Array(
"/assets/images/icons/SixtyToHundredPercent.png",
"/assets/images/icons/LessThanThirtyPercent.png",
"/assets/images/icons/ThirtyToSixtyPercent.png",
"/assets/images/icons/SixtyToHundredPercent.png"
);

$("#Show > option").each(

    function()  {
        $(this).attr("data-image",Diagrams[this.index]);
                }

    );

$("#Show").msDropdown({visibleRows:2}); 


}

これはうまくいったようですので、今はこの男と同じ問題を解決してくれる人が必要です...

于 2013-08-28T15:25:52.577 に答える