javascript - Open a form after clicking more cell table (jquery/php) -
i have page calendar table , i've used script change bgcolor (css class .clicked) value of 1 or more td tag.
$(document).mousedown(function() { $("td#target").bind('mouseover',function(){ $(this).toggleclass('clicked'); }); }) .mouseup(function() { $("td#target").unbind('mouseover'); }); $("td#target").mousedown(function() { $(this).toggleclass('clicked'); });
now need on mouseup open popup form, i'm not able it. can me?
example: i'm selecting cells 15 20 may, on mouse click open popup form "compile these fields day 15-16-17-18-19-20"
thank you
you can make divs positioned fixed or absolute , overlay underlaying content. overlaying div(popup) normal div can make forms , whatever want. here quick jsfiddle threw toghether: http://jsfiddle.net/0zvqm5nr/35/
here code of jsfiddle:
html
<div class="calendar"> calendar here , every entry can generate div 'calendar-entry' shown in html <div class="calendar-entry"> <button id="popupbutton" class="calendar-entry-button">15.05.2015</button> <div class="popup"> <h2>15.05.2015</h2> activity: <form action="somesite.php" method="post"> <select id="activity"> <option class="placeholder" selected disabled>select</option> <option>work</option> <option>youth leave</option> </select> <input type="submit" value="save"> </form> </div> </div> <div class="calendar-entry"> <button id="popupbutton" class="calendar-entry-button">16.05.2015</button> <div class="popup"> <h2>16.05.2015</h2> activity: <form action="somesite.php" method="post"> <select id="activity"> <option class="placeholder" selected disabled>select</option> <option>work</option> <option>youth leave</option> </select> <input type="submit" value="save"> </form> </div> </div> , on...
css
.calendar { width: 500px; height: 500px; background: green; } .popup { width: 500px; height: 500px; background: grey; display: none; position: fixed; top: 0; left: 0; }
javascript
var buttons = document.getelementsbyclassname("calendar-entry-button"); (var = 0; < buttons.length; i++) { buttons[i].onclick = function() { this.parentnode.getelementsbyclassname("popup")[0].style.display = "block"; } }
i hope helped.
Comments
Post a Comment