mischka Posted June 17, 2013 Report Share Posted June 17, 2013 Hey guys, I'm trying to implement a kind of modal dialog window, much like the one you see in the admin section. For example when editing an airport you click on edit on the row and a window pops up with the relevant form. I've tried analyzing and extracting the code in the admin section, as well as trying to google, but after an hour it has yielded nothing but frustration I admit that jquery is not my strength, so i thought it might be better to ask someone who does know what I need and knows how to make it work with phpvms. After all, this functionality seems to be built into phpvms already, so why not use it? thanks in advance Quote Link to comment Share on other sites More sharing options...
mischka Posted June 24, 2013 Author Report Share Posted June 24, 2013 Ok, I've gotten a bit further on my own accord, but still need some help. This experimental page does exactly what I want: http://european.virtualairlines.eu/jquerytest.htm However, if I paste the script code into my schedule_results.tpl, or any other page, it doesn't work any more.. eg http://european.virtualairlines.eu/index.php/schedules <- click on the flight number to get the details the schedule_details.tpl will just load in a full window, not in the dialog box. from the test htm I took out the calls, because they were duplicated in the phpvms header page. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.0/jquery-ui.min.js"></script> I also tried moving my script into the <head> section but it doesn't matter.. the experimental page has the script in the body and works just fine. who knows where the problem lies? Im getting a tad frustrated here Quote Link to comment Share on other sites More sharing options...
Strider Posted June 25, 2013 Report Share Posted June 25, 2013 Do you mind if I take the code and try and see if I can get it to work on my VA? Quote Link to comment Share on other sites More sharing options...
mischka Posted June 25, 2013 Author Report Share Posted June 25, 2013 sure, go ahead... but post the results so others have a benefit too! Quote Link to comment Share on other sites More sharing options...
Strider Posted June 25, 2013 Report Share Posted June 25, 2013 I have got it working somewhat. It opens up in a new window, problem is, it is basically opening the site in an iframe. I have the banner and the nav. How I got it that far was putting the js code in the schedule_results.tpl file. How to get it to show without the nav and banner I am unsure. Quote Link to comment Share on other sites More sharing options...
Strider Posted June 25, 2013 Report Share Posted June 25, 2013 http://malaysiava.org/index.php/schedules/view You can see what I have got there. If you click on the flight number, it opens up in a new window. Quote Link to comment Share on other sites More sharing options...
mischka Posted June 25, 2013 Author Report Share Posted June 25, 2013 if I open that link I get to the standard phpvms schedule search, which doesn't work.. I never get any results, even if I "select all" airports. to open the schedule details page without the nav and banner, use action.php instead of index.php, that'll show it without the skin. Quote Link to comment Share on other sites More sharing options...
Strider Posted June 26, 2013 Report Share Posted June 26, 2013 http://malaysiava.org/index.php/schedules Try that Quote Link to comment Share on other sites More sharing options...
mischka Posted June 26, 2013 Author Report Share Posted June 26, 2013 doesn't work! it just keeps showing the spinner and "searching" nothing ever shows up. Tried in IE and chrome I can really recommend frontschedules.. works much much better than the standard schedule search in phpvms maybe you can post the code of what you did, and where you put it? Quote Link to comment Share on other sites More sharing options...
Moderators Parkho Posted June 26, 2013 Moderators Report Share Posted June 26, 2013 I can offer you to use a hidden table row and then on click the table row opens showing the details in the same table. You can see it on my website. Go to www.parkho.ir -> Login using the provided username and password -> click on "try out center-pilot" -> click on "FlightBookingSystem_V1.0" then click on search and the schedules page opens up then if you click on detail image you'll see what I mean. I assure you it's working and yet it has very simple coding. Quote Link to comment Share on other sites More sharing options...
mischka Posted June 26, 2013 Author Report Share Posted June 26, 2013 it wont let me log in... tried with ALD0001 and also the email address provided, and the supplied password but it wont let me in. About your solution: I really want to use this modal window on different places of my website (like pirep history, pilot brief and others) where I just need a dialog window and JIT loading. So thanks for the idea but it doesn't suit my needs Quote Link to comment Share on other sites More sharing options...
Moderators Parkho Posted June 26, 2013 Moderators Report Share Posted June 26, 2013 Hi, try this direct link :http://parkho.ir/phpvms Quote Link to comment Share on other sites More sharing options...
Strider Posted June 26, 2013 Report Share Posted June 26, 2013 the code is the exact same, just I put the js code in the schedule_results.tpl file. Quote Link to comment Share on other sites More sharing options...
mischka Posted June 26, 2013 Author Report Share Posted June 26, 2013 @parkho: yes, I managed to get in now. It looks really neat but it's not exactly what I need @strider: yes, I also put it in the schedule_results.tpl. This is what my schedule_result.tpl looks like: <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css" type="text/css" /> <style> .loading { background: url(/img/spinner.gif) center no-repeat !important} </style> <script type="text/javascript"> $(function (){ $('a.ajax').click(function() { var url = this.href; // show a spinner or something via css var dialog = $('<div style="display:none" class="loading"></div>').appendTo('body'); // open the dialog dialog.dialog({ // add a close listener to prevent adding multiple divs to the document close: function(event, ui) { // remove div with all data and events dialog.remove(); }, modal: true, height: 600, width: 700, position: ['center',80], title: "Schedule details" }); // load remote content dialog.load( url, {}, // omit this param object to issue a GET request instead a POST request, otherwise you may provide post parameters within the object function (responseText, textStatus, XMLHttpRequest) { // remove the loading class dialog.removeClass('loading'); } ); //prevent the browser to follow the link return false; }); }); </script> and then the rest the link looks like this: <a class="ajax" href="<?php echo url('/schedules/details/'.$route->id);?>"><?php echo $route->code . $route->flightnum?> <?php echo '('.$route->depicao.' - '.$route->arricao.')'?> </a> Quote Link to comment Share on other sites More sharing options...
Strider Posted June 26, 2013 Report Share Posted June 26, 2013 When you look at the code , it shows above the search part of the schedules. Quote Link to comment Share on other sites More sharing options...
Moderators Parkho Posted June 26, 2013 Moderators Report Share Posted June 26, 2013 try this: <a class="a.ajax" href="<?php echo url('/schedules/details/'.$route->id);?>"><?php echo $route->code . $route->flightnum?> <?php echo '('.$route->depicao.' - '.$route->arricao.')'?> </a> Quote Link to comment Share on other sites More sharing options...
Strider Posted June 26, 2013 Report Share Posted June 26, 2013 I am unsure that will work parkho, as in the js script the a.ajax, is just calling an a link with the class ajax. It is the same way in a css file where you would go a.ajax{color:#00000;} Quote Link to comment Share on other sites More sharing options...
Moderators Parkho Posted June 26, 2013 Moderators Report Share Posted June 26, 2013 I was just looking at the code in admin ops_airlineform.tpl and noticed that the <a> tag has an id as "dialog" and a class as "JqModal" Quote Link to comment Share on other sites More sharing options...
Strider Posted June 26, 2013 Report Share Posted June 26, 2013 I have got it working the way you want it to. Place the following at the beginning of the schedules_results.tpl file: <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css" type="text/css" /> <script type="text/javascript"> $(function (){ $('a.ajax').click(function() { var url = this.href; // show a spinner or something via css var dialog = $('<div style="display:none" class="loading"></div>').appendTo('body'); // open the dialog dialog.dialog({ // add a close listener to prevent adding multiple divs to the document close: function(event, ui) { // remove div with all data and events dialog.remove(); }, modal: true, height: 600, width: 700, position: ['center',80], title: "Schedule details" }); // load remote content dialog.load( url, {}, // omit this param object to issue a GET request instead a POST request, otherwise you may provide post parameters within the object function (responseText, textStatus, XMLHttpRequest) { // remove the loading class dialog.removeClass('loading'); } ); //prevent the browser to follow the link return false; }); }); </script> replace the link that has the flight number with this: <a class="ajax" href="<?php echo SITE_URL?>/action.php/schedules/details/<?php echo $route->id;?>"><?php echo $route->code . $route->flightnum?></a> Preview: Quote Link to comment Share on other sites More sharing options...
mischka Posted June 26, 2013 Author Report Share Posted June 26, 2013 that looks really great, and just how I want it! However... just updated my schedule_results.tpl with the code you posted -> nothing then I downloaded your schedule_results and temporarily put it on my site -> nothing either! seems its not so much a problem of the specific code in the results.tpl but either in the header or a client-side issue.. still, your schedule_results doesn't work on any of my computers (my sim-pc, my two thinkpads, my girlfriends dell) .. now I wonder, does mine work on yours? this is the page with your code in it: http://european.virt.../FrontSchedules Quote Link to comment Share on other sites More sharing options...
Strider Posted June 26, 2013 Report Share Posted June 26, 2013 No it doesn't I get [b]Notice[/b]: The template file "/home/virtuala/domains/virtualairlines.eu/public_html/european//core/templates/airport_search.tpl" doesn't exist in [b]/home/virtuala/domains/virtualairlines.eu/public_html/european/core/classes/TemplateSet.class.php[/b] on line [b]248[/b] Quote Link to comment Share on other sites More sharing options...
mischka Posted June 26, 2013 Author Report Share Posted June 26, 2013 Oh bugger, pasted the wrong link: this should do: http://european.virtualairlines.eu/index.php/schedules anyway, I'm on to something now, I think I know where the issue is Quote Link to comment Share on other sites More sharing options...
mischka Posted June 26, 2013 Author Report Share Posted June 26, 2013 yay, it works finally! it appeared to be a problem in my layout.tpl... the order of some script refs was the other way around. however, now my dropdown menu's don't work anymore... gosh, I hate jquery! anyway, I'll figure it out now.. thank y'all for your help Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.