In a web app for which I'm responsible, I've been asked to sort contents of a form field by date descending using the date that starts each list item. I'd like to do this either onBlur or  onSave because users are entering stuff willy-nilly. In any event, though I can very easily sort items alphabetically using javascript's array sort() method, sorting by date substring descending is whole 'nuther kettle of fish.  

Here's an example of what I'd need to sort by date descending (and yes, each item has a bullet char):

•01/21/2013 - something happened; something else happened on 01/30/2013.
•04/02/2014 - John J. buys a new car
•02/25/2014 - We went to a movie. It was awesome, but a better one comes out on 12/31/2019.
•05/21/2012 - Let's keep sorting things.


Let's say the above is all included in a form field with id=myActivities. I'd like to, onBlur, get this:

•04/02/2014 - John J. buys a new car
•02/25/2014 - We went to a movie. It was awesome, but a better one comes out on 12/31/2019.
•01/21/2013 - something happened; something else happened on 01/30/2013.
•05/21/2012 - Let's keep sorting things.

Any brilliant sorters out there? I'm at your mercy.

By the way, in a windows app I can use to edit/update existing content, I use the (slightly proprietary looking) jscript code below. It works properly, but it's simple alphabetical sorting. Nothing to do with substring dates.

****************************************

var sortBox = new Array("Events");…

Hi experts

    Bootstrap columns are not aligning side by side.  Please see the below reactjs code

  <div className="container-fluid" style={{margin:0,padding:0,height:'auto',minHeight:'100%',minWidth:'100%'}}>
                <div className="row">
                     <div className="col-12 col-sm-12 col-md-7 col-lg-7 col-xl-7" style={{height:'auto'}}>
                         {this.props.children}
                     </div>
                     <div className="col-12 col-sm-12 col-md-4 col-lg-4 col-xl-4" style={{color:"#6F7070",
                          height:'auto'}}>
                          <div className='selectable' style={{fontSize: 18}}>
                             <div>
                                 <div style={{fontSize:24, fontWeight:'bold'}}>{record.title}</div>
                                     <div style={{fontSize:12, fontWeight:'bold'}}>Date Created:{date}</div>
                                     <div style={{fontSize:12, fontWeight:'bold',fontStyle:'italic'}}>{record.type}</div>
                                 </div>
                             </div>
                             {fullRecord}
                             <div style={{display:'inline-block',margin:0,padding:0,marginTop:15,marginBottom:10}} className="row">
                                 <span> Details <hr style={{height:3,display:"inline-block",backgroundColor:"#AAC33C",
                                     width:270,verticalAlign:"middle",marginLeft:10}}/>
     

Select all Open in new window

…

How to get multiple values from N # of same class name? In the example below I want to grab the text whenever there is a class name of  "offer-product-label" and divide with a pipe. If there is a currency amount, strip to only dollar amount. So the below example would return => "Line of Credit|450000"

I started with:

var pResult;
		 
	    var prodResult = document.getElementsByClassName("offer-product-label");
        for (var i = 0; i < prodResult.length; i++) {
            pResult = prodResult[i].innerText;
        }

Select all Open in new window

for the below:

<fieldset class="fieldset-line">
                            <legend tabindex="0">Request summary</legend>
                            <dl tabindex="0">
                                <dt>Product</dt>
                                <dd class="offer-product-label">Line of Credit</dd>
                            </dl>
                            <dl tabindex="0">
                                <dt>Amount Requested</dt>
                                <dd class="offer-product-label">$45,000.00</dd>
                            </dl>

                        </fieldset>

Select all Open in new window

Thanks!

On my blog page here http://ccdenver33.staging.wpengine.com/blog/ how can I make it so that the menu tab Blog Posts has a border around it but just when you're on that page?

Hi experts, I am using bootstrap 3
I have a page with 4 dropdown options and 4 number INPUT with different ids (see dropdown 1 below)
How can I add an eventlistener to either the dropdown or number input changes its value ?
What I am trying to accomplish is calculate the price on the fly (ajax and php)
P.S. I can calculate the price IF THE USER CLICKS A BUTTON, but I want to do the same calculations WITHOUT THE USER CLICK THE CALCULATE PRICE BUTTON

Tnx for any help or suggestions


    <div class="form-row">
     <div class="form-group col-sm-5">
        <label for="sel1" class="control-label">Select list :</label>
        <select class="input-large" id="sel1">
          <option value="399">Nativity Set - 399.00&#160;&#160; </option>
          <option value="189">Deer Set - 189.00&#160;&#160; </option>
          <option value="35">Sheep - 35.00&#160;&#160;</option>
          <option value="35">Cow - 35.00&#160;&#160;</option>
          <option value="35">Donkey - 35.00&#160;&#160;</option>
          <option value="35">Goat - 35.00&#160;&#160;</option>
        </select>
     </div>
       
     <div class="form-group">
      <label for="iQ1" class="col-sm-2 control-label">Quantity</label>
      <div class="col-sm-2">
        <input type="number" class="form-control" id="iQ1" value="1">    
      </div>  
     </div>
    </div>

I am developing a around 300 HTML web pages that need a version number displayed in the footer. Problem is some customers are using version A and some people are using version B. So depending on the user, I want to display A or B and only want to change it in one place. I have used document.write and pointed to a .js named ver.js file which contains

document.write('Test: V4.5')

Select all Open in new window

and the HTML to display on the page:

<script language="javascript" type="text/javascript" src="ver.js"></script> 

Select all Open in new window

My question is, if I have three different versions I need to display depending on the user, what is the best method to display ('Test: V4.5') or ('Test: V4.6') or ('Test: V4.7') using  JavaScript which would be written in one place. I don't want to have to hand write the version number on each page, but only in one spot. I asked this question on Stack Exchange and got beat to hell by those who answered. Can you guys help? I am trying to learn this and hope I am asking this question the right way.

Further, lets say user ONE should see Version 4.5 on the bottom of their page, and user TWO should see Version 4.8 at the bottom of the page. And since I have 300 pages, I only want to change the version in one place to be reflected on all 300 pages?

I know I can use Variables, but not sure the correct way to do this. I am not using PHP.

Thank you for not yelling at me.

Hi,

My button don't work but alert work after success, what should I do ?

<!DOCTYPE html>
<html lang="fr">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="icon" type="image/gif" href="img/drapeauBruxelles.gif" />
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/style.css">
    <title>Projet Map</title>
    <style>
       #map {
        height: 600px;
        width: 90%;
       }
    </style>
  </head>
  <body>
    <div class="container-fluid bg-2 text-center">
      <h1 class="margin">Des Marqueurs Google Maps</h1>
    </div>
    <div id="map"></div>
    <nav class="navbar navbar-default">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="https://developers.google.com/maps/documentation/javascript/adding-a-google-map?hl=fr">My Google Maps</a>
        </div>
        <div class="collapse navbar-collapse" id="myNavbar">
          <ul class="nav navbar-nav navbar-right">

            <li><button type="button" id="btn1">Fontaine d'eau</button></li>
            <li><button type="button" onclick="actionImmediate();">Fontaine d'eau</button></li>
   

Select all Open in new window

…

I think I read WHY this is happening but not sure how to fix it. If you visit

http://www.day6management.com/

The slideshow slides stack and then finally start the slideshow. I don't want the user to see this issue and have read a few css ideas and a few java ideas. Since I'm not experienced in Java at all, I'm not sure where to put a fix to resolve this. The page source code should show my script and css for it.

I need someone to show me where to put a fix on this in my code.

I have a button on my razor page which loads a javascript file that I need to debug into. But I can not set a breakpoint there since the file does not exist in the list, on the Chrome debugger.

How do I get that file to load so I can set the debugger?

Thanks

how can I integrate a search engine on my website , using js , php and mysql ?
NB . the user can search any thing inside the site!

Hi,

I have a slideshow, that needs to disable the thumbnail hover when I click the start button and also activate the thumbnail hover when I click stop,

Any ideas on how to do this??

This is the code I have so far ;

HTML

<!DOCTYPE html>
<head>

<title>Slide Show </title>

<script type="text/javascript" src="js/slideshow.js"></script>
<link href="css/style.css" rel="stylesheet" type="text/css" />

</head>

<body onresize="rescale();">


<div id="main">

<h1 id="heading">Slide Show</h1>


<img id="image" src="images/1.jpg" />

<p>
	<span onclick="changeImage('grand canyon')" onmouseover="previewImage(1)" onmouseout="revertImage()">Image 1</span> | 
	<span onclick="changeImage('lake')" onmouseover="previewImage(2)" onmouseout="revertImage()">Image 2</span> | 
	<span onclick="changeImage('flower')" onmouseover="previewImage(3)" onmouseout="revertImage()">Image 3</span> | 
	<span onclick="changeImage('turtle')" onmouseover="previewImage(4)" onmouseout="revertImage()">Image 4</span> | 
	<span onclick="changeImage('bird')" onmouseover="previewImage(5)" onmouseout="revertImage()">Image 5</span> 

</p>
<button id="startBtn" onclick="start()">Start </button> 
<button id="stopBtn" onclick="stop()">Stop </button>

<!--<p><a href="javascript:start()">start</a> | <a href="javascript:stop()">stop</a></p>-->

</div>

</body>
</html>

Select all Open in new window

Javascript

// JavaScript Document

//  variable to hold the current image number
var current = 1;
// 

Select all Open in new window

…

Hi,

I need to work out some maths using javascript and html.

I need to just use core js and html not any libraries

I need to take £3 and times that by 2 every day for 30 days and then have it output in HTML in a list  like so :

day 1 = £3
day 2 = £6
day 3 = £12
day 4 = £24
and so on...

I'm very new to js so if anyone could show me some example code that could accomplish this task I would be very grateful. Thanks.