0

I'm using jQuery dialog to gather the informations from users then append to my desired div. This function works very well, but when comes to edit/update my contents, I have no ideas how to do.

Front-Ends HTML

<li class="description_panel">
    <a id="editPanel" href="#"></a>
    <a id="closeBtn" href="#" class="closeButton"></a>
    <div class="panel_title">
        <h2>**Subscribe Here!**</h2>
    </div>
    <div class="panel_img">
        <img width="320px" src="link_to_img_url"/>
    </div>
    <div class="panel_description">
        <p>My paragraph 1</p>
        <p>My paragraph 2</p>
    </div>
</li>

Edit Panel

<div id="edit-dialog-form" title="Edit Panel">
    <form id="formUpdatePanel">
        <div class="form-group">
            <div class="rows">
                <div class="col-md-12">
                    <div class="col-lg-12">
                        <h5>Panel title::</h5>
                            <input style="margin-bottom:20px;" id="updatePanelTitle" class="form-control input-lg" name="title" placeholder="Panel Title" type="text"></input>
                     </div>
                 </div>
             </div>
             <div class="rows">
                <div class="col-md-12">
                    <div class="col-lg-12">
                        <h5>URL to image: </h5>
                            <input style="margin-bottom:20px;" id="updatePanelImageURL" class="form-control input-lg" name="imageURL" placeholder="Link to Image URL" type="text"></input>
                    </div>
                </div>
             </div>
            <div class="rows">
                <div class="col-md-12">
                    <div class="col-lg-12">
                        <h5>Panel description:</h5>
                            <textarea id="updatePanelDescription" rows="5" cols="50" style="width:312px"></textarea>
                    </div>
                </div>
            </div>
        </div>
    </form>
</div>

JQuery

$('#editPanel').click(function(){
     editDialog.dialog("open");
});

var editDialog = {...};

function updateDialog {

}

How to retrieve all the inputs values and textarea value and display in the dialog input box and update/overwrite the contents again.

FlowCastv
  • 147
  • 1
  • 13
  • Take a look at http://stackoverflow.com/questions/6049687/jquery-ui-dialog-box-need-to-return-value-when-user-presses-button-but-not-wor – bestprogrammerintheworld Mar 04 '15 at 06:30
  • @bestprogrammerintheworld I don't get it. How to transfers the values for panelTitle, panelImageURL and panelDescription into dialog panel's inputs ? – FlowCastv Mar 04 '15 at 06:58
  • I'm not sure if I follow what you mean. But you may grab the value of panelTitle by doing var title = $("#updatePanelTitle").val(); That value could be retrieved in the callback described in the link I gave you. – bestprogrammerintheworld Mar 04 '15 at 07:03

0 Answers0