javascript - Need to assign unique ID to div in PHP file -

javascript - Need to assign unique ID to div in PHP file -

i'm outputting calendar appear series of buttons end user. each button have name of event. when tap on button, toggle downwards show short description , date/time event.

so far i've got event buttons show. however, when click on button, top event's description , date/time show. need help figuring out how assign each event instance unique div id. tried other examples on here, because next code written in php, creating var = blank; throws processing error.

public function event_block($title, $desc, $start, $end, $where = null, $img = null, $span = 6) { $start_arr = date_parse($start); $start_stamp = mktime($start_arr['hour'], $start_arr['minute'], $start_arr['second'], $start_arr['month'], $start_arr['day'], $start_arr['year']); $start_date_int = date('ymd', $start_stamp); $end_arr = date_parse($end); $end_stamp = mktime($end_arr['hour'], $end_arr['minute'], $end_arr['second'], $end_arr['month'], $end_arr['day'], $end_arr['year']); $end_date_int = date('ymd', $end_stamp); $today_date_int = date('ymd'); $time_range = date('g:i a', $start_stamp) . ' ' . date('g:i a', $end_stamp); if ($start_date_int == $today_date_int) { $date = 'today'; if ($start_date_int < $end_date_int) { $time_range = 'until ' . date('l, f js', $end_stamp); } } else { $date = date('l, f js', $start_stamp); if ($start_date_int < $end_date_int) { $time_range = 'from' . date('l, f js', $start_stamp) . ' through ' . date('l, f js', $end_stamp); } } $output = ' <!-- event block --> <div class="span' . $span . ' event"> <div class="panel-group id="accordion"> <div class="panel-heading"> <a data-toggle="collapse" data-parent="#accordion" href="#addmore" class="btn btn-primary btn-lg">' . $title . '</a>'; if (trim($desc) && $date == 'today') { $output .= '<div id="addmore" class="panel-collapse collapse"> <div class="panel-body">' . trim($desc) . '</div>'; } $output .= '<p style="padding-left: 5px;">'; if (trim($desc) && $date != 'today') { $output .= '<div id="addmore" class="panel-collapse collapse"> <div class="panel-body">' .trim($desc) . '</div>'; $output .= '<span style="color: #e8d0a9;">date:</span> ' . $date . '<br />'; } $output .= '<span style="color: #e8d0a9;">time:</span> ' . $time_range . '</p></div>'; homecoming $output;

}

this helpful post looked @ before: create dynamic div unique ids - jquery

below code on calendar.php uses info above generate calendar of events:

<?php error_reporting(e_all); ini_set('display_errors', true); ini_set('display_startup_errors', true); require_once('include/event_signage.php'); $sign = new signage; // collect , format info $hero_content = array( 'heading' => '', 'text' => '', ); $events_now_arr = $sign->databoard_get('url'); $events_today_arr = $sign->databoard_get('url'); $events_week_arr = $sign->databoard_get('url'); // build sign $signage = $sign->header(); //$signage .= $sign->masthead($masthead_content); $signage .= '<div class="container-fluid"> <!-- container -->'; $signage .= $sign->hero_unit($hero_content); $event_ids = array(); // happnening if (count($events_now_arr)) { $signage .= '<div><h2>right now!</h2></div>'; foreach ($events_now_arr $events_arr) { if (!in_array($events_arr['id'], $event_ids) && $events_arr['cal_id'] != 'community') { $blocks[] = $sign->event_block($events_arr['title'], $events_arr['description'], $events_arr['start'], $events_arr['end']); } $event_ids[] = $events_arr['id']; } $signage .= $sign->gather_blocks($blocks); unset($blocks); } // happening today if (count($events_today_arr)) { $signage .= '<div><h2>today</h2></div>'; foreach ($events_today_arr $events_arr) { if (!in_array($events_arr['id'], $event_ids) && $events_arr['cal_id'] != 'community') { $blocks[] = $sign->event_block($events_arr['title'], $events_arr['description'], $events_arr['start'], $events_arr['end']); } $event_ids[] = $events_arr['id']; } $signage .= $sign->gather_blocks($blocks); unset($blocks); } // happening week if (count($events_week_arr)) { $current_hour = date('g'); $cutoff = 39; if ($current_hour <= 16) { $cutoff = 27; if ($current_hour <= 14) { $cutoff = 24; } if ($current_hour <= 13) { $cutoff = 21; } if ($current_hour <= 12) { $cutoff = 18; } if ($current_hour <= 10) { $cutoff = 15; } } $signage .= '<div><h2>this week</h2></div>'; $i = 0; foreach ($events_week_arr $events_arr) { if (!in_array($events_arr['id'], $event_ids) && $events_arr['cal_id'] != 'community' && $i < $cutoff) { $blocks[] = $sign->event_block($events_arr['title'], $events_arr['description'], $events_arr['start'], $events_arr['end'], null, null, 4); $i++; } $event_ids[] = $events_arr['id']; } $signage .= $sign->gather_blocks($blocks, 3); unset($blocks); } $signage .= '</div> <!-- /container -->'; $signage .= $sign->footer(); // output sign print $signage; ?>

you're going wrong. don't need assign unique id of divs. need standard dom operations. e.g

<div> calendar entry #1 <div>more info that's hidden entry #1</div> <button onclick="showmore(this);">click here more</button> </div> <div> calendar entry #2 <div>more info that's hidden entry #2</div> <button onclick="showmore(this);">click here more</button> </div>

since every element in dom knows in tree, don't need specific id on first container div, need know button got clicked on, why this beingness passed showmore() function:

function showmore(obj) { obj.previoussibling().style.display = 'block'; // more info div }

of course, code isn't particularly "portable". assumes "more info" div going right next "toggle" button, should plenty give general idea.

javascript php jquery html