2

jQuery Mobile 1.3.1 でフォームを使用してダイアログを設定しましたが、フォームを送信するためのボタンが使用可能なすべてのスペースを占めています。

最後にボタン付き： ここに画像の説明を入力

ご覧のとおり、すべてをカバーしています。

それなしで： ここに画像の説明を入力

ここでいいのですが、データを送信するためのボタンが必要です。

問題を再現するために jsFiddle を実行しようとしましたが、この場合、2 つのページが必要な例を設定する方法がわかりません。ごめんなさい。

ダイアログの作成に使用されるコードは次のとおりです。

<!DOCTYPE html>
<html lang="es">
<body id="derp" data-role="page">
    <header id="header" data-role="header" data-position="fixed" data-tap-toggle="false" data-theme="c">
         <h1 id="titulo_header">Aaaaa </h1>

    </header>
    <div data-role="content" data-theme="c">
        <form method="post" action="#">
            <fieldset data-role="controlgroup" data-mini="true" id="jv_add_jugadores_local">
                <legend>Aaaaa Aaaaa AaaaaaaAaaaa Aaaaa AaaaaaaAaaaa Aaaaa Aaaaaaa:</legend>
                <label>01 -- Aaaaa Aaaaa Aaaaaaa
                    <input type="checkbox" name="eLoc[]" value="2">
                </label>
                <label>02 -- Aaaaa Aaaaa Aaaaaaa
                    <input type="checkbox" name="eLoc[]" value="9341">
                </label>
                <label>05 -- Aaaaa Aaaaa Aaaaaaa
                    <input type="checkbox" name="eLoc[]" value="4">
                </label>
                <label>09 -- Aaaaa Aaaaa Aaaaaaa
                    <input type="checkbox" name="eLoc[]" value="336">
                </label>
                <label>13 -- Aaaaa Aaaaa Aaaaaaa
                    <input type="checkbox" name="eLoc[]" value="506">
                </label>
            </fieldset>
            <fieldset data-role="controlgroup" data-mini="true" id="jv_add_jugadores_visitante">
                <legend>Aaaaa Aaaaa AaaaaaaAaaaa Aaaaa AaaaaaaAaaaa Aaaaa Aaaaaaa:</legend>
                <label>03 -- Aaaaa Aaaaa Aaaaaaa
                    <input type="checkbox" name="eLoc[]" value="9242">
                </label>
                <label>09 -- Aaaaa Aaaaa Aaaaaaa
                    <input type="checkbox" name="eLoc[]" value="1117">
                </label>
                <label>11 -- Aaaaa Aaaaa Aaaaaaa
                    <input type="checkbox" name="eLoc[]" value="464">
                </label>
                <label>14 -- Aaaaa Aaaaa Aaaaaaa
                    <input type="checkbox" name="eLoc[]" value="732">
                </label>
                <label>18 -- Aaaaa Aaaaa Aaaaaaa
                    <input type="checkbox" name="eLoc[]" value="9305">
                </label>
                <label>22 -- Aaaaa Aaaaa Aaaaaaa
                    <input type="checkbox" name="eLoc[]" value="9241">
                </label>
            </fieldset>
            <button type="submit" data-icon="check" id="add_jugadores">Añadir</button>
        </form>
    </div>
</body>
</html>

編集: これは、ダイアログ ボックスのスタイルを設定するために使用した唯一の CSS です。

.ui-dialog-contain {
    max-width: 900px !important;
}

そして、これは私が期待していたものです（画像を編集したので、解決策ではありません） ここに画像の説明を入力

4

1 に答える 1