¿Cómo hacer que un ExtJS ComboBox se muestre en línea con texto?

3

Quiero que se muestre lo siguiente en una sola línea. He intentado usar estilos flotar y mostrar.

Show this input <input type="text" name="filterOp" id="filterOp"/> inline.


<script type="text/javascript">
    new Ext.form.ComboBox({
        applyTo: 'filterOp',
        triggerAction: 'all',
        name: 'item',
        mode: 'local',
        lazyInit: true,
        displayField: 'name',
        valueField: 'id',
        forceSelection: true,
        typeAhead: true,
        inputType:'text',
        fieldLabel: 'Item selection',
        style: "display: inline-block",
        store: new Ext.data.JsonStore({
            autoLoad: true,
            url: 'reporting/json_report_filter_operators.jsp',
            root: 'rows',
            fields:['id', 'name']
        })
    })

</script>

2

La forma más sencilla de hacer esto es anular los estilos de la página.

Primero, envuelva su párrafo en una etiqueta P con una identificación especial.

<p id="my-inline-override">
  Show this input <input type="text" name="filterOp" id="filterOp"/> inline.
</p>

Luego, puede agregar un selector CSS a su página que se asegure de que la etiqueta DIV agregada por Ext JS se muestre en línea (tenga en cuenta que "x-form-field-wrap" es la clase del contenedor DIV insertado, puede ver esto si usa herramientas de desarrollo de Chrome para navegar por el DOM).

<style>
#my-inline-override div.x-form-field-wrap {
    display: inline;
}
</style>
0

Lo siento, tu pregunta es un poco confusa. ¿Qué es exactamente lo que intenta obtener en una sola línea? ¿El cuadro combinado? ¿El código? ¿Cada elemento del cuadro combinado? Si se trata de cada elemento, simplemente amplíe el cuadro combinado o haga que cada elemento tenga un desbordamiento oculto y un ancho fijo.

1
  • Quiero ver "Mostrar esta entrada <input type =" text "name =" filterOp "id =" filterOp "/>" en la misma línea cuando se procesa en el navegador. ComboxBox cuando se renderiza genera un div que es un elemento de bloque que lo renderiza en una nueva línea. 19/11/10 a las 18:48