php - angiv dato på siden - Udvikleren.dk - Programmering, webdesign og grafik

Tags: php jquery-ui jquery

Bruger #17136 @ 01.08.13 12:44

Davs

Lige nu er jeg i gang med at angive dato på siden,

en af det tidligere indlæg fik jeg den her kode en herind fra udvikleren.dk
som så sådan her ud;

HTML kode

 <input type="text" name="dob" id="datepicker" class="opretBrugerBox" readonly="readonly">

og have en jquery kode som så sådan her ud;

JScript kode

 $(function() {
     var today = new Date();        
     var dd = today.getDate(); 
     var mm = today.getMonth();
     var yyyy = today.getFullYear();        
         
     $("#datepicker").datepicker({         
         dateFormat: 'yy-mm-dd', 
         changeMonth: true,            
         changeYear: true,
         yearRange: '1950:'+yyyy,
         maxDate: new Date(yyyy, mm, dd),
         
         onSelect: function(value, ui) {                
             var dob = new Date(value);
             var age = new Date(today - dob).getFullYear() - 1970;
             $('#age').html(age+' år gammel');
             
             // alders kontrol
             var status = (age<20)? true: false;                         
             $('#msg').html( (! status )? '': 'Kan ikke opret dig!' );
             $("input[type=submit]").attr("disabled", status); 
         }
     });        
 });

Der skal jeg lige sige at der virker det helt fint,

Lige nu ser min bare sådan her ud;

HTML kode

 <input type="text" name="dob" id="datepicker" class="opretBrugerBox">

dato-date.js og ligger ind i mappen js

JScript kode

 $(function() {
     var today = new Date();        
     var dd = today.getDate(); 
     var mm = today.getMonth();
     var yyyy = today.getFullYear();        
         
     $("#datepicker").datepicker({         
         dateFormat: 'yy-mm-dd', 
         changeMonth: true,            
         changeYear: true,
         yearRange: '1950:'+yyyy,
         maxDate: new Date(yyyy, mm, dd),
     });        
 });

Det skal lige sige at jeg har mod-rewrite på.

så når jeg kalder på mit jquery kode, så gør jeg sådan her;

JScript kode

 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
     <script type="text/javascript" src="/js/dato-date.js"></script>
 <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

Min submit ser sådan her ud;

HTML kode

 <input type="submit" name="opretbruger" value="Opret bruger" id="OpretbrugerNU" disabled="disabled"/>

Nåår jeg prøver at klik på mit html input så sker det her;
http://billedeupload.dk/?v=yc0o.png

Dog skal jeg lige sige at jeg har min html ind i form og lagt den ind i table så det pænt ud

Jeg har også prøve at kigge på Jquery-UI og der sker heller ikke noget overhovedet på nogle måde.

Har du set en fejl som jeg har overset ?

4 svar postet i denne tråd vises herunder
0 indlæg har modtaget i alt 0 karma

Sorter efter stemmer Sorter efter dato

Bruger #16075 @ 01.08.13 13:33

1.223

her er en mulig konfligt

Kode

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

jquery-latest.min.js vil hente jquery vertion 2.xxx
1/jquery.min.js vil hente seneste vertion i vertion 1 serien
du må kun have et jquery runtime kørende

dvs de settings du har lavet med jquery.min.js bliver overskrevet, og det kan være noge af de settings der anvendes i dato-date.js
slet denne linje
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

alternativt

Kode

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript" src="/js/dato-date.js"></script>

jquery vertion 2.xxx er mindre end ½ år gammel, og jg har ikke selv tested den med datepicker
documentationen anvender stadig vertion 1.9,
http://jqueryui.com/datepicker/

edit

hvor includere du din UI ?? det er deri datepicker ligger

en af det tidligere indlæg fik jeg den her kode en herind fra udvikleren.dk
som så sådan her ud;

http://www.udvikleren.dk/forum/40134/foedselsdato-system/

vedr mail, fra i nat
du kan sette time på også ved at kigge på
http://trentrichardson.com/examples/timepicker/

Kode

<!DOCTYPE html>
<html>
<head>
	<title>test</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" >
	<style type="text/css">	
	</style>
	<style type="text/css">	
	</style>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />	
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>	
	<script type="text/javascript" src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.7/i18n/jquery-ui-i18n.min.js"></script>
	<script type="text/javascript">		
     $(function() {
		var today = new Date();
		var dd = today.getDate();
		var mm = today.getMonth();
		var yyyy = today.getFullYear();
		// viser måneds navn og år som dansk
		$.datepicker.setDefaults( $.datepicker.regional[ "da" ] );		
		$("#datepicker").datepicker({
			dateFormat: 'yy-mm-dd',
			changeMonth: true,
			changeYear: true,
			yearRange: '1950:'+yyyy,
			maxDate: new Date(yyyy, mm, dd),
		});
    });	
	</script>		
</head>
<body>
<form action="#" method="post">
<input type="text" name="dob" id="datepicker" class="opretBrugerBox">
<input type="submit" name="opretbruger" value="Opret bruger" id="OpretbrugerNU" disabled="disabled"/>
</form>
</body>
</html>

Indlæg senest redigeret d. 01.08.2013 13:56 af Bruger #16075

Bruger #17136 @ 01.08.13 15:51

Hej Ronny,

Jeg tog din kode og kigge på den.

Det er sådan at den kode skal kun virker når man er log ind på siden!.

Det er sådan at jeg har et galleri,

den virker kun hvis jeg har den her tilføj til siden altså ind i min function style.

HTML kode

 <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

Sådan ser det ud i min function side

PHP kode

 function style()
     {
     if($_SESSION["logged_in"] == true)
     {
     ?>
     <script type="text/javascript" src="/tiny_mce/tiny_mce.js"></script>
     <script type="text/javascript">
         tinyMCE.init({
             mode : "textareas",
             theme : "simple"
         });
     </script>
     <?php
     }
     ?>
     <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
     <script type="text/javascript" src="/indhold/css/gallery_kode/lib/jquery.mousewheel-3.0.6.pack.js"></script>
     <script type="text/javascript" src="/indhold/css/gallery_kode/source/jquery.fancybox.pack.js?v=2.1.5"></script>
     <link rel="stylesheet" href="/indhold/css/gallery_kode/source/jquery.fancybox.css?v=2.1.5" type="text/css" media="screen" />
     <script type="text/javascript">
         $(document).ready(function() {
             $(".fancybox").fancybox();
         });
     </script>
     <link rel="shortcut icon" href="/favicon.ico" />
     <link rel="publisher" href="https://plus.google.com/117087897739471092165">
     <meta property="og:image" content="/indhold/logo.png" />
     <link type="text/css" href="/indhold/css/style.css" rel="stylesheet">
     <link type="text/css" href="/indhold/css/tilmeld.css" rel="stylesheet">
     <link rel="stylesheet" type="text/css" media="print" href="/indhold/css/print.css" />
     <?php
     }

ind i filen tilmeld.php ser et sådan her ud;

PHP kode

 <title>Tilmeldsiden</title>
     <?php
         $style = $mebe->style();
     ?>
     <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />    
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>    
     <script type="text/javascript" src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.7/i18n/jquery-ui-i18n.min.js"></script>
     <script type="text/javascript">        
      $(function() {
         var today = new Date();
         var dd = today.getDate();
         var mm = today.getMonth();
         var yyyy = today.getFullYear();
         // viser måneds navn og år som dansk
         $.datepicker.setDefaults( $.datepicker.regional[ "da" ] );        
         $("#datepicker").datepicker({
             dateFormat: 'yy-mm-dd',
             changeMonth: true,
             changeYear: true,
             yearRange: '1950:'+yyyy,
             maxDate: new Date(yyyy+2, mm, dd),
         });
     });    
     </script>

hvis jeg tilføjer den der til galleri så virker dato ikke men hvis jeg tag den væk fra galleri så virker dato fint uden problemer

hmm

EIDT det virker fint og godt lige pt uden problemer overhovedet. og jeg vil klart kig på forslag http://trentrichardson.com/examples/timepicker/

TAK FOR HJÆLPEN!.

Indlæg senest redigeret d. 01.08.2013 16:46 af Bruger #17136

Bruger #16075 @ 01.08.13 17:01

1.223

fint du fik det til at virke

lidt flere time link
https://www.google.dk/search?q=jquery+timepicker
http://www.jquery4u.com/plugins/10-jquery-time-picker-plugins/
http://fgelinas.com/code/timepicker/
http://jonthornton.github.io/jquery-timepicker/

hvorfor ligger du html ind i din class ??
lig alle dine css og js filer i toppen af dit document, det er nemmere at overskue
du includer jquery runtim lib 2 gange det giver ballade

er du sikker på du har lavet en fancybox og tinyMCE html mæssigt og de libs de kalder ??

Kode

$(document).ready(function() {
    $(".fancybox").fancybox();
});

Kode

tinyMCE.init({
    mode : "textareas",
    theme : "simple"
    });

for ellers vil denne fejle og stoppe afviklingen af js

denne virker, men giver en masse fejl da jeg mangler mange js og css filer

Kode

<?php
if(! isset($_SESSION)){
	session_start();
}

$_SESSION["logged_in"] = false;

class mebe{

     function style()
    {
    if($_SESSION["logged_in"] == true)
    {
    ?>
    <script type="text/javascript" src="/tiny_mce/tiny_mce.js"></script>
    <script type="text/javascript">
    // udkomenteret da jeg ikke har filerne til tinyMCE, og ikke lavet htm til den
	/*
	tinyMCE.init({
    mode : "textareas",
    theme : "simple"
    });
	*/
    </script>
    <?php
    }
    ?>
    <!-- slettes 
	<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
    -->
	
	<script type="text/javascript" src="/indhold/css/gallery_kode/lib/jquery.mousewheel-3.0.6.pack.js"></script>
	<script type="text/javascript" src="/indhold/css/gallery_kode/source/jquery.fancybox.pack.js?v=2.1.5"></script>
    <link rel="stylesheet" href="/indhold/css/gallery_kode/source/jquery.fancybox.css?v=2.1.5" type="text/css" media="screen" />
	
	<script type="text/javascript">
    // udkommenteret da jeg ikke har filerne til fancybox, og ikke lavet htm til den
	/*
	$(document).ready(function() {
    $(".fancybox").fancybox();
    });
	*/
    </script>
	<link rel="shortcut icon" href="/favicon.ico" />
    <link rel="publisher" href="https://plus.google.com/117087897739471092165">    
    <link type="text/css" href="/indhold/css/style.css" rel="stylesheet">
    <link type="text/css" href="/indhold/css/tilmeld.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" media="print" href="/indhold/css/print.css" />
	<meta property="og:image" content="/indhold/logo.png" />	
    <?php
    }
}	

?>	
<!DOCTYPE html>
<html>
<head>
	<title>test</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" >
	<style type="text/css">	
	.ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }
	.ui-timepicker-div dl { text-align: left; }
	.ui-timepicker-div dl dt { height: 25px; margin-bottom: -25px; }
	.ui-timepicker-div dl dd { margin: 0 10px 10px 65px; }
	.ui-timepicker-div td { font-size: 90%; }
	.ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }

	.ui-timepicker-rtl{ direction: rtl; }
	.ui-timepicker-rtl dl { text-align: right; }
	.ui-timepicker-rtl dl dd { margin: 0 65px 10px 10px; }
	
	</style>
	<style type="text/css">	
	</style>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />	
	<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
	<!--
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>	
	-->
	<script type="text/javascript" src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.7/i18n/jquery-ui-i18n.min.js"></script>
	<script type="text/javascript" src="http://trentrichardson.com/examples/timepicker/jquery-ui-timepicker-addon.js"></script>
	
	
	<?php
		$mebe = new mebe();
		$style = $mebe->style();
	?> 
	
	<script type="text/javascript">		
     $(function() {
		var today = new Date();
		var dd = today.getDate();
		var mm = today.getMonth();
		var yyyy = today.getFullYear();
		// viser måneds navn og år som dansk
		$.datepicker.setDefaults( $.datepicker.regional[ "da" ] );		
		
		// http://trentrichardson.com/examples/timepicker/		 
		$('#datepicker').datetimepicker({
		// $("#datepicker").datepicker({
			dateFormat: 'yy-mm-dd',
			changeMonth: true,
			changeYear: true,
			yearRange: '1950:'+yyyy,
			maxDate: new Date(yyyy, mm, dd),
			// timepicker setting
			timeFormat: 'HH:mm', // :ss
			hourText: 'timer',
			minuteText: 'minutter',
			timeText: 'tid'			
		});
    });	
	</script>		
</head>
<body>
<form action="#" method="post">
<input type="text" name="dob" id="datepicker" class="opretBrugerBox">
<input type="submit" name="opretbruger" value="Opret bruger" id="OpretbrugerNU" disabled="disabled"/>
</form>
</body>
</html>

Bruger #17136 @ 01.08.13 17:17

Kode

$(document).ready(function() {
    $(".fancybox").fancybox();
});

Kode

tinyMCE.init({
    mode : "textareas",
    theme : "simple"
    });

for ellers vil denne fejle og stoppe afviklingen af js

denne virker, men giver en masse fejl da jeg mangler mange js og css filer

Kode

<?php
if(! isset($_SESSION)){
	session_start();
}

$_SESSION["logged_in"] = false;

class mebe{

     function style()
    {
    if($_SESSION["logged_in"] == true)
    {
    ?>
    <script type="text/javascript" src="/tiny_mce/tiny_mce.js"></script>
    <script type="text/javascript">
    // udkomenteret da jeg ikke har filerne til tinyMCE, og ikke lavet htm til den
	/*
	tinyMCE.init({
    mode : "textareas",
    theme : "simple"
    });
	*/
    </script>
    <?php
    }
    ?>
    <!-- slettes 
	<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
    -->
	
	<script type="text/javascript" src="/indhold/css/gallery_kode/lib/jquery.mousewheel-3.0.6.pack.js"></script>
	<script type="text/javascript" src="/indhold/css/gallery_kode/source/jquery.fancybox.pack.js?v=2.1.5"></script>
    <link rel="stylesheet" href="/indhold/css/gallery_kode/source/jquery.fancybox.css?v=2.1.5" type="text/css" media="screen" />
	
	<script type="text/javascript">
    // udkommenteret da jeg ikke har filerne til fancybox, og ikke lavet htm til den
	/*
	$(document).ready(function() {
    $(".fancybox").fancybox();
    });
	*/
    </script>
	<link rel="shortcut icon" href="/favicon.ico" />
    <link rel="publisher" href="https://plus.google.com/117087897739471092165">    
    <link type="text/css" href="/indhold/css/style.css" rel="stylesheet">
    <link type="text/css" href="/indhold/css/tilmeld.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" media="print" href="/indhold/css/print.css" />
	<meta property="og:image" content="/indhold/logo.png" />	
    <?php
    }
}	

?>	
<!DOCTYPE html>
<html>
<head>
	<title>test</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" >
	<style type="text/css">	
	.ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }
	.ui-timepicker-div dl { text-align: left; }
	.ui-timepicker-div dl dt { height: 25px; margin-bottom: -25px; }
	.ui-timepicker-div dl dd { margin: 0 10px 10px 65px; }
	.ui-timepicker-div td { font-size: 90%; }
	.ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }

	.ui-timepicker-rtl{ direction: rtl; }
	.ui-timepicker-rtl dl { text-align: right; }
	.ui-timepicker-rtl dl dd { margin: 0 65px 10px 10px; }
	
	</style>
	<style type="text/css">	
	</style>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />	
	<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
	<!--
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>	
	-->
	<script type="text/javascript" src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.7/i18n/jquery-ui-i18n.min.js"></script>
	<script type="text/javascript" src="http://trentrichardson.com/examples/timepicker/jquery-ui-timepicker-addon.js"></script>
	
	
	<?php
		$mebe = new mebe();
		$style = $mebe->style();
	?> 
	
	<script type="text/javascript">		
     $(function() {
		var today = new Date();
		var dd = today.getDate();
		var mm = today.getMonth();
		var yyyy = today.getFullYear();
		// viser måneds navn og år som dansk
		$.datepicker.setDefaults( $.datepicker.regional[ "da" ] );		
		
		// http://trentrichardson.com/examples/timepicker/		 
		$('#datepicker').datetimepicker({
		// $("#datepicker").datepicker({
			dateFormat: 'yy-mm-dd',
			changeMonth: true,
			changeYear: true,
			yearRange: '1950:'+yyyy,
			maxDate: new Date(yyyy, mm, dd),
			// timepicker setting
			timeFormat: 'HH:mm', // :ss
			hourText: 'timer',
			minuteText: 'minutter',
			timeText: 'tid'			
		});
    });	
	</script>		
</head>
<body>
<form action="#" method="post">
<input type="text" name="dob" id="datepicker" class="opretBrugerBox">
<input type="submit" name="opretbruger" value="Opret bruger" id="OpretbrugerNU" disabled="disabled"/>
</form>
</body>
</html>

Tak for links og det hele, jeg vil kig på det men tak fra min side!

Jeg vil lige prøve noget af det

## Grund til at jeg ligger html ind i class det er fordi jeg bruger det flere gange,

Indlæg senest redigeret d. 01.08.2013 17:18 af Bruger #17136

angiv dato på siden

Karma barometer (30 dage)

Modtaget

Givet

Favorit hos
Forum tråde
Artikler