如何更改自动完成程序小部件的大小 [英] How to change autocompleter widget size

问题描述

我尝试了项目中的代码来更改选择框的大小:

I tried the code from the project to change the size of the select box:

<strong>Result Div :</strong>
<div id="formResult" class="result ui-widget-content ui-corner-all">Submit form bellow.</div>
<strong>Topics Div :</strong>
<div id="topics" class="result ui-widget-content ui-corner-all"></div>
<s:form id="form" action="echo" theme="simple" cssClass="yform">
    <fieldset>
        <legend>Select Box as Autocompleter</legend>
        <div class="type-select">
            <label for="echo">Echo: </label>
            <sj:autocompleter
                    id="customers"
                    name="echo"
                    list="%{customers}"
                    listValue="name"
                    listKey="id"
                    selectBox="true"
                    selectBoxIcon="true"
                    onChangeTopics="autocompleteChange"
                    onFocusTopics="autocompleteFocus"
                    onSelectTopics="autocompleteSelect"
                    cssStyle="width:100%;"
                    />
        </div>
        <div>
            <sj:submit
                    targets="formResult"
                    value="AJAX Submit"
                    indicator="indicator"
                    button="true"
                    />
            <img id="indicator" src="images/indicator.gif" alt="Loading..." style="display:none"/>
        </div>
    </fieldset>
</s:form>

<br/>

但是它不起作用.我不知道这段代码是什么问题.

but it doesn't work. I don't know what is the problem with this code.

推荐答案

查看生成的HTML，<sj:autocompleter>标记的cssStyle或cssClass均未设置为实际输入字段.但是您可以使用普通CSS设置此输入字段的样式.将<sj:autocompleter>放在某个元素内以仅更改特定的输入，然后可以使用类似的内容:

Looking at generated HTML neither cssStyle nor cssClass of <sj:autocompleter> tag is set to actual input field. But you can use plain CSS to style this input field. Put your <sj:autocompleter> inside of some element to change only specific input then you can use something like that:

.type-select .s2j-combobox-input {
  width: 100%;
}

其中type-select是包装器元素的类，而s2j-combobox-input是<sj:autocompleter>生成的输入字段的类.

Where type-select is class of wrapper element and s2j-combobox-input is the class of generated input field for the <sj:autocompleter>.

这篇关于如何更改自动完成程序小部件的大小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！