jqgridで自動補完コンボテキスト要素の幅を増やす方法

Question

編集と追加のすべてのフィールドは、固定幅を持っているようです。

編集/追加の幅を増やそうとしましたが、入力要素の幅はまだ であり、colmodelで定義されている列の幅よりも小さすぎます。

これらの幅を増やす方法や、colmodelで定義されている幅と同じにする方法はありますか？ ラベルの列の風合いが大きすぎます。 の幅がラベルテキストの幅の最大値と等しくなるようにラベルの列幅を減らす方法

更新1

colmodelは、オートコンプリートコンボボックス、インライン編集モードコードで

{name:"AutocompleteWidthIssue", 
edittype:"custom", 
editoptions:{ 
    maxlength:54, 
    size:54, 
    custom_element:function(value, options) { 
    return combobox_element(value, options,'17','test','Summak','Tululiik') 
    }, 
    custom_value:combobox_value 
}, 
editable:true, 
width:39, 
fixed:true 
}, 


function combobox_element(value, options, width, colName, entity, andmetp) { 
    var elemStr = '<div><input style="width:' + width + 'px" value="' + value + '"/>' + 
'<button type="button" style="height:20px;width:20px;vertical-align:center;margin-left:-2px" tabindex=-1/></div>'; 
    var newel = $(elemStr)[0]; 

    input.autocomplete({ 
     source: 'Grid/GetLookupList' 
    } 
); 

    $("button", newel) 
    .button({ icons: { primary: 'ui-icon-triangle-1-s'} }) 
     }); 

    return newel; 
} 

上記の正しい幅コンボボックスを描画含まれ、 サイズ：54は無視されます。

フォームの編集/追加モードのみでオートコンプリートテキスト入力要素の幅を増やす方法、そのテキスト要素の幅がサイズなどの属性から幅を持つようにするにはどうすればよいですか？

Answer 1

editoptions: {size:35, maxlength: 45}で試してください。おそらくそれはあなたが必要とするものです。対応する列の入力要素のサイズを大きくして、データをスクロールせずに約35文字を入力できるようにする必要があります。 45文字以上の入力は禁止されます。水平スクロールなしでフォームのすべての入力要素を表示できるようにするには、フォームの編集/追加のwidthパラメータのデフォルト値300を増やす必要があります。

長いラベルを追加する設定は不要です。フォームは自動的に列の幅を増やすテーブルで構成されます。

UPDATED

：あなたは custom_elementによって返されたHTMLフラグメントを囲む親 <span class="FormElement">ため display:inline-blockを使用することができます。あなたが hereを見つける次のコード

function combobox_element(value, width) { 
    var elemStr = '<div>' + 
        '<input class="FormElement ui-widget-content ui-corner-all" ' + 
        'style="vertical-align:top;width:' + width + 'px" value="' + 
        value + '"/>' + 
        '<button class="ui-widget-content ui-corner-right ui-button-icon"' + 
        ' style="height:22px;width:22px;" tabindex="-1" /></div>', 
     newel = $(elemStr)[0]; 

    setTimeout(function() { 
     $(newel).parent().css({display: "inline-block"}) 
       .parent().css({'padding-bottom': 0}); 
     $('input:first', newel).autocomplete({ 
      source: 'Grid/GetLookupList' 
     }); 

     $("button", newel).button({ 
      icons: { primary: 'ui-icon-triangle-1-s'}, 
      text: false 
     }); 
    }, 50); 

    return newel; 
} 

は

対応するデモが生成されます。