Data z modálního okna zpět do formuláře

SinyaWeo

Dobrý den,

mám standardní formulář v Presenteru a z jednoho inputu pomocí

->setAttribute('data-toggle', 'modal')
->setAttribute('data-target','#mapModal-dialog')

otevírám Bootstrap modal s Location pickerem

Latte:

{control carForm}

<div id="mapModal-dialog" class="modal fade" role="dialog">
    <div class="modal-dialog">

        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Zadejte místo posledního parkování</h4>
            </div>
            <div class="modal-body">
                <div class="form-horizontal" style="width: 550px">
                    <div id="mapModal" style="width: 100%; height: 400px;"></div>
                    <div class="clearfix">&nbsp;</div>
                    <div class="m-t-small">
                        <label class="p-r-small col-sm-1 control-label">Lat.:</label>
                        <div class="col-sm-3">
                            <input type="text" class="form-control" style="width: 110px" id="mapModal-lat"/>
                        </div>
                        <label class="p-r-small col-sm-2 control-label">Long.:</label>
                        <div class="col-sm-3">
                            <input type="text" class="form-control" style="width: 110px" id="mapModal-lon"/>
                        </div>
                    </div>
                    <div class="clearfix"></div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Zavřít</button>
                <button type="button" class="btn btn-primary">Uložit</button>
            </div>
        </div>
    </div>
</div>

Nemám ale ponětí, jak výsledné souřadnice prostřelit zpátky do toho inputu v presenteru.

Mohl byste mi prosím někdo polopatě poradit jak na to? S Nette se znám teprve dva týdny.

Děkuji Milan

GEpic

Přidej si do formuláře hidden prvky „lat“ a „long“ a poté by mělo stačit:

<script>
$('#selektor').locationpicker({
    inputBinding: {
        latitudeInput: $('[name="lat"]'),
        longitudeInput: $('[name="long"]'),
    },
    enableAutocomplete: true
});
</script>

SinyaWeo

Kdybych nebyl debil… Děkuji mockrát, funguje to :-)

Pokud by na to zase někdo narazil tak přikládám řešení:

Presenter:

$form->addText('car_lat', 'Poslední místo parkování:')
        ->setAttribute('data-toggle', 'modal')
        ->setAttribute('data-target','#mapModal-dialog')
        ->setRequired();
$form->addText('car_lon',' ')
        ->setAttribute('data-toggle', 'modal')
        ->setAttribute('data-target','#mapModal-dialog')
        ->setRequired();

Latte:

{control carForm}

    <!-- Modal -->
    <div id="mapModal-dialog" class="modal fade" role="dialog">
        <div class="modal-dialog">

            <!-- Modal content-->
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                    <h4 class="modal-title">Zadejte místo posledního parkování</h4>
                </div>
                <div class="modal-body">
                    <div class="form-horizontal" style="width: 550px">
                        <div id="mapModal" style="width: 100%; height: 400px;"></div>
                        <div class="clearfix">&nbsp;</div>
                        <div class="clearfix"></div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Vložit</button>
                </div>
            </div>
        </div>
    </div>

Skript:

					$('#mapModal').locationpicker({
    location: { latitude: 49.9, longitude: 15.5 },
    zoom: 7,
    inputBinding: {
        latitudeInput: $('[name="car_lat"]'),
        longitudeInput: $('[name="car_lon"]'),
        radius: 0
    },
    enableAutocomplete: true
});
$('#mapModal-dialog').on('shown.bs.modal', function () {
    $('#mapModal').locationpicker('autosize');
});