Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>This may work with the date picker. You have to add the content holder and textbox though.</p> <pre><code> &lt;head&gt; &lt;meta charset="utf-8" /&gt; &lt;link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" /&gt; &lt;script src="http://code.jquery.com/jquery-1.9.1.js"&gt;&lt;/script&gt; &lt;script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"&gt;&lt;/script&gt; &lt;style&gt; #sitehtn { display: none } .container { width: 100%; height: 600px; background-color: rgb(179, 174, 174); } #datepickerT { margin-left: 2em; } .eventDateDiv { height: 150px; width: 400px; margin-left: 0; margin-right: auto; } #daysBetween { margin-top: -1.4em; margin-left: 30%; } .eventShowDiv { height: 250px; width: 30%; margin-left: auto; margin-right: auto; } .event { color: green; margin-top: 5px; } &lt;/style&gt; &lt;script&gt; function loading() { $( ".datepickerF" ).datepicker({ showOn : "button", buttonImage : "calendar.gif", buttonImageOnly : true }); $( ".datepickerT" ).datepicker({ showOn : "button", buttonImage : "calendar.gif", buttonImageOnly : true }); $('.getdays').click(function() { var start = $(this).prev().prev().find('input').datepicker('getDate'); var end = $(this).prev().find('input').datepicker('getDate'); var days = (end - start)/1000/60/60/24; $(this).next().text(days); }); $('input[id=courtierRadio]').change(function() { $('#hideRadio').html(""); $('#hideRadio').append(getAppleInfo()); }); function displayResult(browser) { document.getElementById("result").value=browser } }; window.onload = loading; // anti-pattern! keep reading... function getAppleInfo() { var eventDateDiv =""; eventDateDiv = $("&lt;div&gt;&lt;/div&gt;").addClass("eventDateDiv"); eventDateDiv.append($("&lt;p&gt;&lt;/p&gt;").text("FROM: ").append($("&lt;input&gt;").attr("class", "datepickerF").attr("type", "text"))); eventDateDiv.append($("&lt;p&gt;&lt;/p&gt;").text("TO: ").append($("&lt;input&gt;").attr("class", "datepickerT").attr("type", "text"))); eventDateDiv.append($("&lt;button&gt;&lt;/button&gt;").text("NO.OF DAYS ").attr("class", "getdays")); eventDateDiv.append($("&lt;p&gt;&lt;/p&gt;").attr("class", "daysBetween")); eventDateDiv.append($("&lt;a&gt;").text("Add Another").attr("href", "#").attr("onclick", "belowDiv(this)")); return eventDateDiv; } function belowDiv(self){ $('#hideRadio').append(getAppleInfo()); loading(); } &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;div class="container"&gt; &lt;div class="eventDateDiv" title="numb"&gt; &lt;div class="event"&gt; EVENT DATE &lt;/div&gt; &lt;p&gt;FROM: &lt;input type="text" class="datepickerF" /&gt;&lt;/p&gt; &lt;p&gt;To: &lt;input type="text" class="datepickerT" /&gt;&lt;/p&gt; &lt;button class="getdays"&gt;NO.OF DAYS &lt;/button&gt; &lt;p class="daysBetween"&gt; &lt;/p&gt; &lt;/div&gt; &lt;div class="eventShowDiv" title="dumb"&gt; &lt;div class="event"&gt; EVENT SHOW TIME &lt;/div&gt; &lt;p&gt;TYPE OF SHOW: &lt;/p&gt; &lt;label&gt; &lt;input type="radio" name="sitewebGroup" value="Courtier" id="courtierRadio" /&gt; Unique &lt;/label&gt; &lt;input type="text" name="site" /&gt; &lt;br /&gt; &lt;div id="hideRadio"&gt; &lt;label&gt; &lt;input type="radio" name="sitewebGroup" value="Agence" id="agenceRadio" /&gt; Varied &lt;/label&gt; &lt;input type="text" name="textfield3" /&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload