SitePoint Sponsor

User Tag List

Results 1 to 15 of 15
  1. #1
    SitePoint Member
    Join Date
    Mar 2011
    Posts
    9
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Changing the format in a global clock with date

    I have a difficult problem with the changing of the format with many way in a global clock with date . Can someone help me?
    Code:
    <select name="city" onClick="">
    <option value="0">Adelaide</option>
    <option value="1">Anchorage</option>
    <option value="2">Athens</option>
    <option value="3">Baker Island</option>
    <option value="4">Buenes Aires</option>
    <option value="5">Caracas</option>
    <option value="6">Chihuahua</option>
    <option value="7">Denver</option>
    <option value="8">Dhaka</option>
    <option value="9">Dubai</option>
    <option value="10">Gander</option>
    <option value="11">Grytviken</option>
    <option value="12">Honolulu</option>
    <option value="13">Iles Marquises</option>
    <option value="14">Kabul</option>
    <option value="15">Karachi</option>
    <option value="16">Katmandu</option>
    <option value="17">Kingston, Norfolk Island</option>
    <option value="18">London</option>
    <option value="19">Lord Howe Island</option>
    <option value="20">Magadan</option>
    <option value="21">Manila</option>
    <option value="22" selected="selected">Moscow</option>
    <option value="23">Mumbai</option>
    <option value="24">New York</option>
    <option value="25">Paris</option>
    <option value="26">Ponta Delgada</option>
    <option value="27">Rangoon</option>
    <option value="28">Rawaki</option>
    <option value="29">Sambas</option>
    <option value="30">Samoa</option>
    <option value="31">Starbuck Island</option>
    <option value="32">Sydney</option>
    <option value="33">Tehran</option>
    <option value="34">Tokyo</option>
    <option value="35">Vancouver</option>
    <option value="36">Wellington</option>
    </select>
    </fieldset>
    <fieldset  class="field">
    <legend><strong><em>Select the date</em></strong></legend>
    <select name="Date" id="Date" onClick="">
    <option value="a">28th March 2010</option>
    <option value="b">28 March 2010</option>
    <option value="c">28th Mar 2010</option>
    <option value="d">28 Mar 2010</option>
    <option value="e">28/03/2010</option>
    <option value="f">28th March 10</option>
    <option value="g">28 March 10</option>
    <option value="h">28th Mar 10</option>
    <option value="i">28 Mar 10</option>
    <option value="j">28/03/10</option>
    <option value="k">28th March</option>
    <option value="l">28 March</option>
    <option value="m">28th Mar</option>
    <option value="o">28 Mar</option>
    <option value="p">28/03</option>
    </select>
    </fieldset>
    <fieldset  class="field">
    <legend><strong><em>Select the day</em></strong></legend>
    <select name="day" id="day" onClick="">
    <option value="f">Sunday</option>
    <option value="s">Sun</option>
    </select>
    </fieldset>
    <fieldset  class="field">
    <legend><strong><em>Select the time</em></strong></legend>
    <select name="time" id="time" onClick="">
    <option value="a">5:28:12 am</option>
    <option value="b">5:28 am</option>
    <option value="c">5:28:12</option>
    <option value="d">17:28:12</option>
    <option value="e">17:28</option>
    <option value="f">5:28</option>
    Thanks.

  2. #2
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,119
    Mentioned
    28 Post(s)
    Tagged
    2 Thread(s)
    What is the story behind what you are trying to do?

    Select City, Date, Day(shouldn't be needed), Time - then what?

  3. #3
    SitePoint Member
    Join Date
    Mar 2011
    Posts
    9
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello, the basic problem is to combine all, city,day,date,time for many countries and the user must change dynamic every part he want.I would like advise because is difficult.Thanks

  4. #4
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Would toLocaleString be of some use? That way whatever date you supply is converted automatically to how the user has their environment set up.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  5. #5
    SitePoint Member
    Join Date
    Mar 2011
    Posts
    9
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello, I try this code but I do not think is usefull for my problem.Thanks.
    Code:
    <html>
    <head>
    <script type="text/javascript">
    function getDate()
    {
    alert("getting date...");
    var d = new Date();
    var s = d.toLocaleString();
    alert(s);
    return s;
    }
    function setDate()
    {
    alert("Setting date");
    document.getElementById("myDate").value = getDate();
    }
    </script>
    </head>
    
    <body>
    <form name="form1">
    Date: <input type="text" id="myDate" size="20" />
    <br /><br />
    <input type="button" value="Today's Date" onclick="setDate();">
    </form>
    </body>
    
    </html>

  6. #6
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by Dimi Cost View Post
    Hello, I try this code but I do not think is usefull for my problem.
    Then I suspect that a way to format dates and times might be useful for you.
    Date Format Method
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  7. #7
    SitePoint Member
    Join Date
    Mar 2011
    Posts
    9
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I run this code in ssh(file transfer) and save as .html but was dead. Do you see any wrong;
    Code:
    <html>
    <head>
    <script type="text/javascript" src="dateformat.js">
    var today = new Date();
    document.getElementById('datetime').innerHTML = today.format('l, jS F Y h:i:sa P');
    </script>
    
    </head>
    
    
    <body>
        <span id="datetime"></span>
    	
    </body>
    </html>
    Thanks.

  8. #8
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by Dimi Cost View Post
    I run this code in ssh(file transfer) and save as .html but was dead. Do you see any wrong;
    Code:
    <html>
    <head>
    <script type="text/javascript" src="dateformat.js">
    var today = new Date();
    document.getElementById('datetime').innerHTML = today.format('l, jS F Y h:i:sa P');
    </script>
    
    </head>
    
    
    <body>
        <span id="datetime"></span>
    	
    </body>
    </html>
    Thanks.
    These are a few of the major problems that you are facing.

    1. The script tag can either load from an external source, or it can interpret the code within the script tags. It can never to both at the same time though. Use one script tag to load the dateformat.js script, and a separate script tag for your own script code.

    2. When the script runs, nothing below it exists yet, so a script cannot manipulate any HTML elements if they come after the script. Either move the script to the end of the body, just before the </body> tag, or delay the running of the script until after the elements have loaded.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  9. #9
    SitePoint Member
    Join Date
    Mar 2011
    Posts
    9
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello, is something like that but difficult to me to combine and manipulate dynamic :
    Code:
    <html>
    <body>
    <?php
    
    $date1=gmdate(" jS F Y ");
    $date2=gmdate(" jS M Y ");
    $date3=gmdate(" j M Y ");
    $date4=gmdate(" j F Y ");
    $date5=gmdate(" j n Y ");
    $date6=gmdate(" jS F ");
    $date7=gmdate(" jS M ");
    $date8=gmdate(" j M  ");
    $date9=gmdate(" j F  ");
    $date10=gmdate(" j n  ");
    $date11=gmdate(" jS F y ");
    $date12=gmdate(" jS M y ");
    $date13=gmdate(" j M  y ");
    $date14=gmdate(" j F  y ");
    $date15=gmdate(" j n  y ");
    $date16=gmdate(" H:i:s ");
    $date17=gmdate(" g:i:s ");
    $date18=gmdate(" g:i:s a ");
    $date19=gmdate(" g:i ");
    $date20=gmdate(" H:i ");
    $date21=gmdate(" g:i a ");
    ?>
    <input type ="text" id="date1" size="30" value="<?php echo $date1 ?>"/><br/>
    <input type ="text" id="date2" size="30" value="<?php echo $date2 ?>"/><br/>
    <input type ="text" id="date3" size="30" value="<?php echo $date3 ?>"/><br/>
    <input type ="text" id="date4" size="30" value="<?php echo $date4 ?>"/><br/>
    <input type ="text" id="date5" size="30" value="<?php echo $date5 ?>"/><br/>
    <input type ="text" id="date6" size="30" value="<?php echo $date6 ?>"/><br/>
    <input type ="text" id="date7" size="30" value="<?php echo $date7 ?>"/><br/>
    <input type ="text" id="date8" size="30" value="<?php echo $date8 ?>"/><br/>
    <input type ="text" id="date9" size="30" value="<?php echo $date9 ?>"/><br/>
    <input type ="text" id="date10" size="30" value="<?php echo $date10 ?>"/><br/>
    <input type ="text" id="date11" size="30" value="<?php echo $date11 ?>"/><br/>
    <input type ="text" id="date12" size="30" value="<?php echo $date12 ?>"/><br/>
    <input type ="text" id="date13" size="30" value="<?php echo $date13 ?>"/><br/>
    <input type ="text" id="date14" size="30" value="<?php echo $date14 ?>"/><br/>
    <input type ="text" id="date15" size="30" value="<?php echo $date15 ?>"/><br/>
    <input type ="text" id="date16" size="30" value="<?php echo $date16 ?>"/><br/>
    <input type ="text" id="date17" size="30" value="<?php echo $date17 ?>"/><br/>
    <input type ="text" id="date18" size="30" value="<?php echo $date18 ?>"/><br/>
    <input type ="text" id="date19" size="30" value="<?php echo $date19 ?>"/><br/>
    <input type ="text" id="date20" size="30" value="<?php echo $date20 ?>"/><br/>
    <input type ="text" id="date21" size="30" value="<?php echo $date21 ?>"/><br/>

  10. #10
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Since you're using PHP, it's much easier to perform date conversions from PHP than from javascript.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  11. #11
    SitePoint Member
    Join Date
    Mar 2011
    Posts
    9
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello, I find this code and I would like help to adapt to my script .
    Code:
    <script type="text/javascript">
    
    
    
    
    var weekdaystxt=["Sun", "Mon", "Tues", "Wed", "Thurs", "Fri", "Sat"]
    
    function showLocalTime(container, servermode, offsetMinutes, displayversion){
    if (!document.getElementById || !document.getElementById(container)) return
    this.container=document.getElementById(container)
    this.displayversion=displayversion
    var servertimestring=(servermode=="server-php")? '<? print date("F d, Y H:i:s", time())?>' : (servermode=="server-ssi")? '<!--#config timefmt="%B %d, %Y %H:%M:%S"--><!--#echo var="DATE_LOCAL" -->' : '<%= Now() %>'
    this.localtime=this.serverdate=new Date(servertimestring)
    this.localtime.setTime(this.serverdate.getTime()+offsetMinutes*60*1000) //add user offset to server time
    this.updateTime()
    this.updateContainer()
    }
    
    showLocalTime.prototype.updateTime=function(){
    var thisobj=this
    this.localtime.setSeconds(this.localtime.getSeconds()+1)
    setTimeout(function(){thisobj.updateTime()}, 1000) //update time every second
    }
    
    showLocalTime.prototype.updateContainer=function(){
    var thisobj=this
    if (this.displayversion=="long")
    this.container.innerHTML=this.localtime.toLocaleString()
    else{
    var hour=this.localtime.getHours()
    var minutes=this.localtime.getMinutes()
    var seconds=this.localtime.getSeconds()
    var ampm=(hour>=12)? "PM" : "AM"
    var dayofweek=weekdaystxt[this.localtime.getDay()]
    this.container.innerHTML=formatField(hour, 1)+":"+formatField(minutes)+":"+formatField(seconds)+" "+ampm+" ("+dayofweek+")"
    }
    setTimeout(function(){thisobj.updateContainer()}, 1000) //update container every second
    }
    
    function formatField(num, isHour){
    if (typeof isHour!="undefined"){ //if this is the hour field
    var hour=(num>12)? num-12 : num
    return (hour==0)? 12 : hour
    }
    return (num<=9)? "0"+num : num//if this is minute or sec field
    }
    
    </script>
    Thanks

  12. #12
    SitePoint Member
    Join Date
    Mar 2011
    Posts
    9
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

  13. #13
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    That script provides only a long and short form of the date to be displayed.

    Code javascript:
    if (this.displayversion=="long")
    this.container.innerHTML=this.localtime.toLocaleString()
    else{
    var hour=this.localtime.getHours()
    var minutes=this.localtime.getMinutes()
    var seconds=this.localtime.getSeconds()
    var ampm=(hour>=12)? "PM" : "AM"
    var dayofweek=weekdaystxt[this.localtime.getDay()]
    this.container.innerHTML=formatField(hour, 1)+":"+formatField(minutes)+":"+formatField(seconds)+" "+ampm+" ("+dayofweek+")"

    It would be that last line where you focus your efforts. What you could do is to break the code it out to a separate function, to help you focus on converting the date it according to all of your chosen requirements.


    Code javascript:
    function formatDate(localtime, displayversion) {
        var hour = localtime.getHours(),
            minutes = localtime.getMinutes(),
            seconds = localtime.getSeconds(),
            ampm = (hour >= 12) ? 'PM' : 'AM',
            weekdaystxt = ['Sun', 'Mon', 'Tues', 'Wed', 'Thurs', 'Fri', 'Sat'],
            dayofweek = weekdaystxt[localtime.getDay()];
     
        if (displayversion === 'long') {
            return localtime.toLocaleString();
        } else {
            return formatField(hour, 1) + ':' + formatField(minutes) + ':' + formatField(seconds) + ' ' + ampm + ' (' + dayofweek + ')';
        }
    }
     
    showLocalTime.prototype.updateContainer = function () {
        var thisobj=this;
        this.container.innerHTML = formatDate(this.localtime, this.displayversion);
        setTimeout(thisobj.updateContainer, 1000); //update container every second
    }
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  14. #14
    SitePoint Member
    Join Date
    Mar 2011
    Posts
    9
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Sorry ,I cannot understand your thoughts.Do you believe with that I can to solve my problem.Thanks.

  15. #15
    SitePoint Member
    Join Date
    Mar 2011
    Posts
    9
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks , I solved the problem.


Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •