php - use ajax call in new pop up window -
i have auto-complete textbox user can insert actor name , works fine. there button "browse movies" should populate dynamic dropdown showing list of movies actor user has inserted in text-box. also, there button "add list" if user click on it, selected options of dropdown (movies) whould added dropdown shows selected movies user.
problemi populate dropdown dynamically when user clicked button, move selected options new dropdown (selecteditems), problem want show dropdown in new pop-up window (not in same page user insert in text-box). don't know how it.. should create ajax phone call in target.html (the new pop window)? appreciate if can allow me know how can this.
this tried:
<script type="text/javascript"> $(document).ready(function () { $("#tags").autocomplete({ source: "actorsauto.php", minlength: 2, select: function (event, ui){ $("#tags").on('autocompletechange change', function (){ var selectedval = $(this).val(); //this selected value autocomplete // here goes ajax call. $.post("actions.php", {q: selectedval}, function (response){ console.log(response); $("#moviename").html(response).show(); }); }).change(); } }); $('#btnright').on('click', function (e) { var selectedopts = $('#moviename option:selected'); if (selectedopts.length == 0) { alert("nothing move."); e.preventdefault(); } $('#selecteditems').append($(selectedopts).clone()); $(selectedopts).remove(); $("#moviename").hide(); $("#tags").val(""); e.preventdefault(); }); function openwindow() { window.open("target.html","_blank","height=200,width=400,status=yes,toolbar=no,menubar=no,location=no"); } </script> <html> <body> <input type="textbox" name= "tag" id="tags" style="display:none;" placeholder="enter actor/actress name here" /> <input type=button onclick="javascript:openwindow()" value="browse movies actor"> <select id="moviename" name="moviename[]" multiple="multiple" width="200px" size="10px" style=display:none;> <input type="button" value=">> add together selected list >>" id="btnright" style="display:none;" /> <select id="selecteditems" name="selecteditems[]" multiple="multiple" style="width:200px; size:10px;"> </select> </select> </body> </html>
you seek this. sorry mistakes or if it's rubbish
target.html
// goes in target.html $('#tags').autocomplete({ source: "actorsauto.php", minlength: 2, select: function (event, ui) { $("#tags").on('autocompletechange change', function () { var selectedval = $(this).val(); //this selected value autocomplete // here goes ajax call. // here's magic. using window.opener allows // access variables , functions defined in parent window. window.opener.getmovies(selectedval); }).change(); } });
page.html
// stays in parent window function getmovies(value) { $.post("actions.php", { q: value}, function (response) { console.log(response); $("#moviename").html(response).show(); }); }
php jquery ajax popup window.open
No comments:
Post a Comment