dpuk44 Posted January 6, 2015 Share Posted January 6, 2015 Hi all. I kinda need some from a more advanced PHP expert. I have a table that displays time slots that are available to be booked. As you can see I have a table with two columns, The 1st column displays the times and the 2nd column has a link that says 'Available'. I want to be able to put all this in a select dropdown box to save space, but how can I do this? <?php $doc = JFactory::getDocument(); $doc->addStyleSheet(JURI::root(false)."components/com_pbbooking/user_view.css"); ?> <style> table#pbbooking td, table#pbbooking th {padding: 0em;} </style> <h1><?php echo JText::_('COM_PBBOOKING_DAY_VIEW_HEADING').' '.Jhtml::_('date',$this->dateparam->format(DATE_ATOM),JText::_('COM_PBBOOKING_DAY_VIEW_DATE_FORMAT'));?></h1> <table id="pbbooking"> <!-- Draw header row showing calendars across the top....--> <tr> <th></th> <!-- first column left blank to display time slots --> <?php foreach ($this->cals as $cal) :?> <th><?php echo $cal->name;?></th> <?php endforeach;?> </tr> <!-- draw table data rows --> <?php while ($this->day_dt_start <= $this->dt_last_slot) :?> <?php $slot_end = date_create($this->day_dt_start->format(DATE_ATOM),new DateTimezone(PBBOOKING_TIMEZONE));?> <?php $slot_end->modify('+ '.$this->config->time_increment.' minutes');?> <tr> <th><?php echo Jhtml::_('date',$this->day_dt_start->format(DATE_ATOM),JText::_('COM_PBBOOKING_SUCCESS_TIME_FORMAT'));?></th> <?php foreach ($this->cals as $cal) :?> <td class="pbbooking-<?php echo (!$cal->is_free_from_to($this->day_dt_start,$slot_end)) ? 'free' : 'busy';?>-cell"> <?php if ($this->day_dt_start>date_create("now",new DateTimeZone(PBBOOKING_TIMEZONE)) && !$cal->is_free_from_to($this->day_dt_start,$slot_end)) :?> <a href="<?php echo JRoute::_('index.php?option=com_pbbooking&task=create&dtstart='.$this->day_dt_start->format('YmdHi').'&cal_id='.$cal->cal_id);?>"> <?php echo (!$cal->is_free_from_to($this->day_dt_start,$slot_end)) ? JText::_('COM_PBBOOKING_FREE') : JText::_('COM_PBBOOKING_BUSY');?> </a> <?php else :?> <?php echo JText::_('COM_PBBOOKING_BUSY');?> <?php endif;?> </td> <?php endforeach;?> </tr> <?php $this->day_dt_start->modify('+ '.$this->config->time_increment.' minutes');?> <?php endwhile;?> <!-- end draw table data rows--> </table> Quote Link to comment Share on other sites More sharing options...
maxxd Posted January 6, 2015 Share Posted January 6, 2015 The structure is already there in what you've got, you just need to finesse it to a different output - create the form, get rid of the table-specific interior tags (tr, th, td), then convert your opening and closing table tags to a select element, and update your foreach() loop to print option elements. Add a select button and you should be good to go. Quote Link to comment Share on other sites More sharing options...
dpuk44 Posted January 8, 2015 Author Share Posted January 8, 2015 Hi maxxd, thanks for the advise. I have gone away and managed to get the times appearing as the options value, however I have lost the hyperlink to book that particular time. Where have I gone wrong? <form> <select> <?php while ($this->day_dt_start <= $this->dt_last_slot) :?> <?php $slot_end = date_create($this->day_dt_start->format(DATE_ATOM),new DateTimezone(PBBOOKING_TIMEZONE));?> <?php $slot_end->modify('+ '.$this->config->time_increment.' minutes');?> <option value="<?php echo Jhtml::_('date',$this->day_dt_start->format(DATE_ATOM),JText::_('COM_PBBOOKING_SUCCESS_TIME_FORMAT'));?>"><?php echo Jhtml::_('date',$this->day_dt_start->format(DATE_ATOM),JText::_('COM_PBBOOKING_SUCCESS_TIME_FORMAT'));?></option> <?php foreach ($this->cals as $cal) :?> <button class="pbbooking-<?php echo (!$cal->is_free_from_to($this->day_dt_start,$slot_end)) ? 'free' : 'busy';?>-cell"> <?php if ($this->day_dt_start>date_create("now",new DateTimeZone(PBBOOKING_TIMEZONE)) && !$cal->is_free_from_to($this->day_dt_start,$slot_end)) :?> <a href="<?php echo JRoute::_('index.php?option=com_pbbooking&task=create&dtstart='.$this->day_dt_start->format('YmdHi').'&cal_id='.$cal->cal_id);?>"> <?php echo (!$cal->is_free_from_to($this->day_dt_start,$slot_end)) ? JText::_('COM_PBBOOKING_FREE') : JText::_('COM_PBBOOKING_BUSY');?> </a> <?php else :?> <?php echo JText::_('COM_PBBOOKING_BUSY');?> <?php endif;?> </button> <?php endforeach;?> <?php $this->day_dt_start->modify('+ '.$this->config->time_increment.' minutes');?> <?php endwhile;?> </select> </form> Quote Link to comment Share on other sites More sharing options...
maxxd Posted January 8, 2015 Share Posted January 8, 2015 You'll need to add a submit button (which I incorrectly called a 'select button' in my last post) to submit the form to your processing script. You can do it via AJAX if you'd rather the page doesn't refresh. Quote Link to comment Share on other sites More sharing options...
dpuk44 Posted January 8, 2015 Author Share Posted January 8, 2015 O sh#t I am really at a loss now. I dont need the page to refresh as once the option is selected it directs to another page. http://www.synergyhealthclinic.co.uk/dayview?dateparam=20150109 Any more help would be AMAZZZZZ Quote Link to comment Share on other sites More sharing options...
dpuk44 Posted January 8, 2015 Author Share Posted January 8, 2015 Any help from anyone would be much appreciated Quote Link to comment Share on other sites More sharing options...
maxxd Posted January 8, 2015 Share Posted January 8, 2015 There's a few things going wrong in the code you've posted. First and foremost, you don't want to create buttons in the foreach() loop, you want to create options. The value of the option should be only $cal->cal_id, and there shouldn't be a link tag in there. Looking at your code, it looks like you want a listing of open time slots on each day, right? I'd recommend building a table listing the dates down the left, then having a drop-down with the open time slots for each of those days in a column to the right. A third column in the row with a submit button would be good - that way you don't have to write the onChange() javascript to submit the form when a time slot is chosen from the drop-down. Basically, each row is a separate form with the following hidden fields: dtstart (for the date), task (always going to be 'create', according to your code), and option (always going to be 'com_pbbooking' according to your code). Name the select element 'cal_id', and when you're creating the options (your foreach() loop), put $cal->cal_id in the value parameter. If you assign the action parameter of your form 'index.php' and the method parameter 'get', the form should work just like the link you posted originally once you click the 'submit' button next to the day you've selected. Obviously I've not tested this, but theoretically it should work. Quote Link to comment Share on other sites More sharing options...
hansford Posted January 8, 2015 Share Posted January 8, 2015 O sh#t I am really at a loss now. I dont need the page to refresh as once the option is selected it directs to another page Where is your development site. Two sites - exactly the same - one to screw up, test etc and one for the public. Quote Link to comment Share on other sites More sharing options...
dpuk44 Posted January 8, 2015 Author Share Posted January 8, 2015 Thanks, all this information is a little to advanced for me I guess. This code was a plugin I found online for Joomla. My test site is local Quote Link to comment Share on other sites More sharing options...
wezhind Posted January 8, 2015 Share Posted January 8, 2015 (edited) I don't know if this will help, but you never know :-) It's just a simple example of the basic logic of what you seem to be trying to do regards the select element. I thought I'd supply it in case you weren't 'getting it'. I have encapsulated places where you should supply own data etc with 2 hash symbols i.e. #your_own_data# <form method="get" action="#page_form_should_go_to#"> <select name="time_slots"> <?php while(#something = something else#) { ?> <option value="<?php echo #the_value_you_want_to_pass#; ?>"> <?php echo #what_you_want_to_show_to_user_for_this_option#; //this could be combination of data i.e you can show the timeslot and the word available if available and so forth... //this is what is displayed to the user NOT what is passed, the value of the option element is what is passed ?> </option> <?php } ?> </select> <button type="submit">Book this timeslot</button> </form> NOTE: This is ONLY the logic for the select element in a form. You have the choice of either having a submit button send your form and chosen option OR you can use JavaScript to send the page onChange. I can't think of a way of simplifying it further for you at the moment, but I think you probably have enough info now to work this out for yourself with a little bit of research. Is the link you gave us an example of what you are trying to achieve or what you have done so far? My apologies if this is too simplified... i.e. your knowledge is more advanced than I've given credit for. I'm just trying to make it as clear as possible for you. p.s. what I've offered will NOT give you what maxxd has suggested regards showing the days as well as the timeslots... Edited January 8, 2015 by wezhind Quote Link to comment Share on other sites More sharing options...
dpuk44 Posted January 9, 2015 Author Share Posted January 9, 2015 wezhind, many many thanks i really appreciate all 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.