[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x

JavaScript

121K

Solutions

109

Content

i
The collection of articles, videos, and posts on this topic.

42K

Contributors

JavaScript is a dynamic, object-based language commonly used for client-side scripting in web browsers. Recently, server side JavaScript frameworks have also emerged. JavaScript runs on nearly every operating system and  in almost every mainstream web browser.

Share tech news, updates, or what's on your mind.

Sign up to Post

I want to show the text  as VIEW when  mouse over the image. 
<img  src="images/<%# DataBinder.Eval(Container.DataItem, "idProduct") %>.jpg"  onmouseover= xxxxxx  onmouseout="this.src='<images/<%# DataBinder.Eval(Container.DataItem, "idProduct") %>.jpg'">

Open in new window


Please advise! Thank you!
1
13 Comments
OWASP: Threats Fundamentals
LVL 12
OWASP: Threats Fundamentals

Learn the top ten threats that are present in modern web-application development and how to protect your business from them.

Start Today!
Is it possible to destory a bind on the DOM and recreate it ? let say i add data to a table from a Ajax request i would need to rebind that to the dom for the new inserted data ?
1
2 Comments 
var jrID = ('a',$(this)).attr('data-id');

Open in new window


Why is this not giving me the id ?
1
4 Comments
Dev Question

So i have this data coming from a table which is a time 00:03:22.

how can i format this in js to the user to be like 3min 22 seconds ?
1
9 Comments
How would I get the value of "You must accept the Bank of the West terms before registering." from the below, when displayed to user?  The only thing I see that is different is the div 2 before the value I want, has a class of "c-alert__icon--big c-alert__icon--error". 
<div class="c-alert__container js-notifications">
<div aria-live="assertive" class="alert c-alert c-alert--floating c-alert--success fade is-hidden js-changes-saved-notification js-floating-alert show" role="alert" tabindex="0">
<div class="d-flex">
<div class="c-alert__icon--big c-alert__icon--success">
<div class="fal fa-check-circle c-icon"></div>
</div>
<div class="c-alert__text c-alert__text--floating js-notification-message">Changes successfully saved</div>
</div>
<div class="c-alert__close c-alert__close--floating">
<a aria-label="Close" class="btn btn--circle btn--disguised btn--close js-floating-alert-close" href="#">
<div class="icon--utility__close icon--utility far fa-info-circle c-icon"></div>
</a>
</div>
</div>

<div aria-live="assertive" class="alert c-alert c-alert--floating c-alert--success document-uploaded-notification fade is-hidden js-document-uploaded-notification js-floating-alert show" role="alert" tabindex="0">
<div class="d-flex">
<div class="c-alert__icon--big c-alert__icon--success">
<div class="fal fa-check-circle c-icon"></div>
</div>
<div class="c-alert__text c-alert__text--floating js-notification-message">Document uploaded successfully.</div>
</div>
<div

Open in new window

…
1
6 Comments
Hi Experts,

      I am not able to create Green checkbox.  Please the below image you can see the html code and css and gui(how it looks).  I am not able create Green checkbox
 
Capture.JPG

the html code I have is 

input.green-check:checked {
  background-color:#5cb85c;
  border-color:#5cb85c;
}

Open in new window


react js code

           (<div className="checkbox checkbox-success">
                              <input type="checkbox" className="green-check" value={j.value} checked={j.selected} key={j.value}  onClick=
                            {(e) => this.props.actions.updateFacet(i.key,j.value,true,false)}
                          />
                           <label>{` ${label}${count}`} </label>
                          </div>)

Open in new window


the check box I need is
 
 test.jpgPlease help me in finding a solution.

With many thanks,

Bharath AK
0
9 Comments
What's the JS regex for the below where I can have "we" and then possibly some characters followed by ".bank.com?:


wedev.bank.com
weqa.bank.com
weuat.bank.com
westage.bank.com
we.bank.com

Thanks!
0
4 Comments
Trying to demonstrate a web worker API to my Web Development students and I wanted to make the process of changing a color image to grayscale in the worker. I know it doesn't take much processing but I'm just using it as an example. I have the grayscale working fine when it's not separated out into a websworker ( jvalencia.ceiwd.com/contoso/badge1.html ) but when I put the code into a webworker the progress bar works but the grayscale image doesn't work--the color image is loaded. ( jvalencia.ceiwd.com/contoso/badge.html )  What am I missing?

WORKING (With no Web Worker):

function showImage(file) {
      reader = new FileReader();
      reader.onload = function (event) {
            console.log(event.target)


            
            if (holder.getContext !== undefined) {
                  var context = holder.getContext('2d');
                  var destX = 0;
                  var destY = 0;
                  var imageObj = new Image();
                  
                  imageObj.onload = function() {
                        context.drawImage(imageObj, destX, destY, holder.width, holder.height);


                        var imgData = context.getImageData(0, 0, holder.width, holder.height); //get image from badge
                        var pixels = imgData.data
                        console.log(pixels);

                        for (var i = 0, n = pixels.length; i < n; i += 4) {
                            var grayscale = pixels[i] * .3 + pixels[i+1] * .59 + pixels[i+2] * .11;
                            pixels[i  ] = grayscale;        // red
                                 pixels[i+1] = grayscale;        // green
                            pixels[i+2] = grayscale;        // blue
                            //pixels[i+3]              is alpha

                            var…
0
2 Comments
How to loop through an Array in Java script where i am getting data from c# code as dictionary

private Dictionary<string, object> _dic = new Dictionary<string, object>();

        public Dictionary<string, object> dic
        {
            get
            {
                return _dic;
            }
            protected set
            {
                _dic = value;
            }
        }
 public string MyDictionaryToJson()
        {
            string jsonString = (new JavaScriptSerializer()).Serialize((object)_dic);
            return jsonString;
            //var entries = _dic.Select(d =>
            //    string.Format("\"{0}\": [{1}]", d.Key, string.Join(",", d.Value)));
            //return "{" + string.Join(",", entries) + "}";
        }
        private static Random random = new Random();
        public static string RandomString(int length)
        {
            const string chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";
            return new string(Enumerable.Repeat(chars, length)
              .Select(s => s[random.Next(s.Length)]).ToArray());
        }
        private DataTable BindData()
        {
            


            DataTable dataTable = new DataTable();
            dataTable.Columns.Add("ColId", typeof(string));
            dataTable.Columns.Add("ColValue", typeof(string));

            for (int i = 0; i < 50000; i++)
            {
                dataTable.Rows.Add(i.ToString(), RandomString(5));

            }
            foreach

Open in new window

…
1
22 Comments
Hi

I'm not a big fan of Googles reCAPTCHA  having clicked on 100's images of traffic lights, bicycles  and fire hydrants to be asked please try again

However can someone explain how  to validate it prior to submitting a form?

I'm assuming this is done within a JavaScript onSubmit function ??

I'm also assuming Is there no PHP  validation as reCAPTCHA  is a JavaScript library so if   isn't enabled reCAPTCHA   wont work


The code bellow is just to get going 
<?php
error_reporting(E_ALL); 
$submit = filter_input(INPUT_POST, "submit");
if($submit){
  // validate form 
  $html = "<div>Hello Thank you for your message</div>";
  }
 
?>

<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
  <head>
    <meta charset="UTF-8">
    <title>Send a Message</title>
    <script src='https://www.google.com/recaptcha/api.js'></script>
      <script>
    function onSubmit() {
      document.getElementById("MyForm").submit();
    }
  </script>
  </head>
  <body>
    <?php
    if ($html){
    echo $html;
      }
    else
      {
      
      
    ?>
    <div class="FormWrap">

          
  <fieldset>

          
    <legend>Email Form</legend> 

          
      <form id="MyForm" action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post">

          
      <p><label for="Fname">Enter full name</label><input type="text"

Open in new window

…
0
13 Comments
Learn Ruby Fundamentals
LVL 12
Learn Ruby Fundamentals

This course will introduce you to Ruby, as well as teach you about classes, methods, variables, data structures, loops, enumerable methods, and finishing touches.

Learn More!
If there are two instances this returns 
var welcome = $("a.c-nav__link.js-nav__link.align-item-center.c-nav__link--flex.active").text();

Open in new window

How do I get the first occurrence of the words? I tried welcome[0] but that only returns the first letter? Sometimes there is only one word but sometimes there are two words:

"Loan Applications

Loan Applications"

or

"Borrower

Borrower"
1
8 Comments
Hello Experts -

I'm  using the datePicker jquery plugin for a calendar dropdown date selection, and I want to exclude weekends and holidays. I've got the weekends disabled (see Javascript function below), but would like to disable holidays as well, as defined by the array in the code below. Could someone show me how to reference the Date.prototype.holidays array to exclude holidays from the datePicker calendar?

Thank you!


$(document).ready(function () {
            $(".date-pick").datepicker({ startDate: '01/01/2000', clickInput: true, beforeShowDay: $.datepicker.noWeekends });
        });

Date.prototype.holidays = {all:['0101','0704','1225'],
         2018:['0903','1122','1123','1226','1227','1228','1231'],
         2019:['0527','0902','1128','1129','1226','1227','1230','1231'],
         2020:['0525','0907','1126','1127','1228','1229','1230','1231'],
         2021:['0531','0906','1125','1126','1227','1228','1229','1230','1231'],
         2022:['0530','0905','1124','1125','1226','1227','1228','1229','1230'],
         2023:['0529','0904','1123','1124','1226','1227','1228','1229']};

Open in new window
0
3 Comments
Hi Experts,

       I am not able to make a transparent opaque background with white foreground as shown in the below image.  

What I currently able to do and have is with image overlay

image with problem
What I need is the  book overlay image (sample) has white foreground as seen below

what I needed
I have many overlay images(book, peridiocals, images, audio, video, maps etc) all with black foreground

see the sample overlay image I have is

current overlay image with black foreground,d, see the image after changing the foreground to white, it has become transperent overlay is not at all displayed


I had tried inverting foreground color to white for the overlay image, but it is not displaying as required
after making the overlay image with white foreground

current css is

.cardoverlay{
   visibility:hidden;
}

.base:hover {
    opacity:0.5!important;

    .cardoverlay {
        visibility: visible!important;
        position:absolute!important;
        display:block;
    }
}

.base:focus {
   opacity:0.5;

   .cardoverlay {
       visibility: visible!important;
       position:absolute;
       display:block;
   }
}

Open in new window


reactjs code is 

 return (
          <div  key={i.id} className={`card base paper ${this.props.selected == i.id ? ' selected': ''}`}
                 style={{width:dimension, height:dimension+50,overflow:"hidden"}} onClick={() => this.props.actions.viewItem(i)}>
              <img src={thumbnail} alt={i.title} className="card-img card-img-top"

Open in new window

…
0
4 Comments
I have this code:
  <div class="adddiv">
				     <p class="deliveryText OldStandard">Delivery </p>
						<form>
						<p class="delivery_days">Monday
						&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 
						 </p>
						<select class='mondaySelect'  MondayOption= "<?php echo $new_counter;?>">
						<?php
						for($i=0;$i <= $qty_value; $i++)
						{
						echo '<option value="'. $i.'">'. $i .'</option>';
						}
						?>
						</select>
						
						<p class="delivery_days">Wednesday &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</p>	
						<select class='wednesdaySelect' WednesdayOption= "<?php echo $new_counter;?>">
						<?php
						for($i=0;$i <= $qty_value; $i++)
						{
						echo '<option value="'. $i.'">'. $i .'</option>';
						}
						?>
						</select>
						
						<p class="delivery_days">Friday &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;</p>	
						<select class='fridaySelect' FridayOption= "<?php echo $new_counter;?>">
						<?php
						for($i=0;$i <= $qty_value; $i++)
						{
						echo '<option value="'.

Open in new window

…
0
6 Comments
Modal is not working after 1st page when click on "Change" button  in datatable bootstrap:



View Info Modal :
<div id="dataModal" class="modal fade">  
      <div class="modal-dialog">  
           <div class="modal-content">  
                <div class="modal-header">  
                     <button type="button" class="close" data-dismiss="modal">&times;</button>  
                     <h4 class="modal-title">Customer Details</h4>  
                </div>  
                <div class="modal-body" id="customer_detail">  
                </div>  
                <div class="modal-footer">  
                     <button type="button" class="btn btn-gradient-light btn-fw" data-dismiss="modal">Close</button>  
                </div>  
           </div>  
      </div>  
 </div>

Open in new window


Change Info Modal:
 <div id="changeModal" class="modal fade">  
      <div class="modal-dialog">  
           <div class="modal-content">  
                <div class="modal-header">  
                     <button type="button" class="close" data-dismiss="modal">&times;</button>  
                     <h4 class="modal-title">Change Status</h4>  
                </div>  
                <div class="modal-body" id="change_detail">  
                </div>  
                <div class="modal-footer">  
                     <button type="button" class="btn btn-gradient-light btn-fw" data-dismiss="modal">Close</button>  
                </div>  
           </div>  
      </div>  
 </div>

Open in new window


JQuery :
 $(document).ready(function(){  
      $('.view_data').click(function(){  
           var book_id = $(this).attr("id");  
           /*alert(employee_id);*/
           $.ajax({  
                url:"ajax/viewCustomer.php",  
                method:"post",  
                data:{book_id:book_id},  
                success:function(data){ 
                     $('#customer_detail').html(data);  
                     $('#dataModal').modal("show");  
                }  
           });  
      });  
 });
  $(document).ready(function(){  
      $('.change_data').click(function(){  
           var book_id = $(this).attr("id");
           $.ajax({  
                url:"ajax/updateServiceStatus.php",  
                method:"post",  
                data:{book_id:book_id},  
                success:function(data){ 
                     $('#change_detail').html(data);  
                     $('#changeModal').modal("show");  
                }  
           });  
      });  
 });

Open in new window
1
3 Comments
inspect element is below
<input type="checkbox" data-role="none">
i was able to use the below vb6 code/java  to check the element checkbox

WebBrowser1.Navigate2 ("javascript:document.querySelectorAll(""input"")[3].click();")

now i have the below inspect element

<input name="Nameit" class="cat_item_option sc-content-pad form-control" id="Nameit" onchange="if (typeof(variableOnChange) == 'function') variableOnChange('Nameit')" maxlength="0000000000" value="">

need vb6 webbrowser control/java command enter  a'Joe Smith' into the element textbox
1
6 Comments
In the checkbox list below...

I need on ckecked  = true for Opened or Clicked

That it is assured that checkboxes No FIlter and Delivered are unchecked
And value = 


<asp:CheckBoxList ID="rblMetrics" CssClass="icheck1" runat="server" AutoPostBack="False"
CellPadding="0" CellSpacing="0" Height="0px" RepeatColumns="2" RepeatDirection="Horizontal"
Width="200px">
    <asp:ListItem Class="icheck1" Selected="True" Value="0" Text="No Filter"></asp:ListItem>
    <asp:ListItem Class="icheck1" Selected="False" Value="1" Text="Delivered"></asp:ListItem>
    <asp:ListItem Class="icheck1" Selected="False" Value="2" Text="Opened"></asp:ListItem>
    <asp:ListItem Class="icheck1" Selected="False" Value="3" Text="Clicked"></asp:ListItem>
</asp:CheckBoxList>

Open in new window
0
4 Comments
I'm trying to figure out why I'm getting an error only on a specific website? We include our tag management code on our 3rd party web apps. I have never had any issues and the same code is running on a bunch of other web apps with no issue but now I'm getting an error only on a specific site?  If you go to the site ( click  here to see ) you'll notice in the dev. console that it throws an error of:

satelliteLib-8b0957229e4e0b480ac27c82c946e106ec00b3ce-staging.js:14 Uncaught ReferenceError: __ is not defined

and in the file it is the underscore in this code 
t.push(n)}):__.map(s,fu

Open in new window


I have no idea why this only happens on this web app?  FYI, if you want to see the site properly, you have to  add "#testdtm" in place of the "#testnhd" and reload the page . These qualifiers set two flags in local storage. You will then have the app set-up properly but get the error. The same files are serverd to many 3rd party sites but for some reason, it throws an error only here? Any insight/help is appreciated.

Thanks!
1
2 Comments
Good morning. I have a question related to actions using javascript and then using a back button on a submit page. I have a javascript function that allows a user to add additional input fields on a web page. So basically a user has one line that they can add an item and then if they need to add additional items, they hit a button and a new input line shows up. Once they do this up to 5 times, these items will be entered into a database with an action page. All of this works as designed. The submit page does some validating, and asks additional questions so I run the forms data to the submit page. But what I noticed is that if the user selects the back button, the added input fields do not show up on the previous page. Is there a way to make those added input forms stay visible when selecting the back button on the page?
0
4 Comments
OWASP: Forgery and Phishing
LVL 12
OWASP: Forgery and Phishing

Learn the techniques to avoid forgery and phishing attacks and the types of attacks an application or network may face.

Start Today!
bootstrap date picker not working on click

i setup the input from js and append it with js to a modals content.

$("#EXPECTED_CLOSE_DATE").datepicker({dateFormat:"yy-mm-dd", minDate: new Date()});

Open in new window


this is sitting in the document.ready

how the input is set up.

   dateForm.push('<div class="form-group">'
                          ,'<label class="control-label col-xs-4" for="edit-deal-date">Estimated closing date</label>' 
                          ,'<div id = "find-bind" class="col-xs-8">'
                          ,'<input id="EXPECTED_CLOSE_DATE" name="EXPECTED_CLOSE_DATE" placeholder="click for new date!" value="'+dealJson.date+'"type="text" class="form-control hasDatepicker">'
                          ,'<input id="subaction" name="subaction" value="updateDeals" type="hidden" class="form-control">'
                          ,'<input id="engID" name="engID" value="'+engID+'" type="hidden" class="form-control">'
                          ,'</div>'
                          ,'</div>' 
                        );
        $("#update-deal").html(dateForm);

Open in new window


any clues ?
0
6 Comments
I need to test if the value returned by the below code is undefined or not? Sometimes, there will be no class named "kycheader"  on the page.

document.getElementsByClassName('kycheader')[0].textContent;

I have tried a few approaches but I always get an error.   
if(document.getElementsByClassName('kyxcheader')[0].textContent != "undefined")

Open in new window

but that doesn't work. I get the following error: Uncaught TypeError: Cannot read property 'textContent' of undefined.   I just want to check if the class name doesn't exist on the current page, then do something else?
0
2 Comments
Hello,

I never tire of asking me: To be a good programmer, what is the relevance of getting a degree in computer science? And a good programmer has in mind all the commands of a programming language, like PHP or JAVA? The oldest languages (MSDOS) had less than 200 commands and functions, currently they must have more than 1000

I would like to hearing from you

sincerely
0
15 Comments
I don't know why the embedded jQuery function below is not returning the value to my JS var? I do get the expected value in console.log(" >>>> FINAL RESULTS RETURNED : " + results); 
function _dtmGetCurrResults(){
	    var results = [];
	    $(function() {
            $('[class*="solid-shape-large-rating-"]').each(function(i, e) {
                var result = this.className.match(/solid-shape-large-rating-(.*?)\s+/);
                results.push(result[1]); 
            });
        results = results.join("|");
        console.log(" >>>> FINAL RESULTS RETURNED : " + results);
		});
		return results;
	};
var myResults = _dtmGetCurrResults();

Open in new window



Thanks!
0
3 Comments
I Am Working With A  JavaScript Proprietary Stock Charting Product called AnyChart Using their AnyStock JS Charting Component and Library…

www.anychart.com

I Downloaded a working example of a AnyChart stock chart JS candlestick stock chart that I want to modify

You can try this stock chart out using the provided attached file components all in a base folder -- See attached zip file called JS_StockChart.zip
this code is found: https://playground.anychart.com/gallery/Stock_Chart_Types/Candlestick_Chart 

I also Uploaded these components to one of my websites to show it works perfectly with their CSV file that they reference in their code
            http://enflow.com/StockChart/index.html

Also works perfectly if I/you put these JS AnyStock Charting components on ones desktop system in a base folder and click on index.html…

Chrome will render it perfectly in the browser for your private desktop.

5.      My PROBLEM…
--- Working with the supplied/referenced CSV file as my own unchanged but referenced local CSV data file...

--- That is referenced in the original index.html first code group below on line number 10 of first code group
--- https://cdn.anychart.com/csv-data/csco-daily.csv

--- My code ref is in the second group of code on line number 2
--- C:\StockChart\csco.csv

--- Anyone can download the sample csv file from the link referenced in the code and try it out for yourself.
---  WHEN YOU PUT THAT FILE ON YOUR DESKTOP AND CHANGE THE CODE TO REF IT THE…
0
24 Comments
I have a Listbox in asp.net that I need to retrieve the text AND the value in an array via javascript and return it to the codebehind to retrieve the values.

I prefer vb.net
            var j = 0;

            while (varFromBox.options.selectedIndex >= 0) {
                var newOption = new Option(); // Create a new instance of ListItem
                newOption.text = varFromBox.options[varFromBox.options.selectedIndex].text;
                newOption.value = varFromBox.options[varFromBox.options.selectedIndex].value;
                varToBox.options[varToBox.length] = newOption; //Append the item in Target Listbox
                varFromBox.remove(varFromBox.options.selectedIndex); //Remove the item from Source Listbox

                items[j] = newOption.text;
                j++;
            }

Open in new window


The javascript above is only storing the text portion, not the numeric value. So when I retrieve it serverside with a webservice, it has both the value and text as text.
HttpContext.Current.Session.Add("L2toL1", ids)

Open in new window


I'm changing my array definition to:

  var items = [[], []];

Open in new window


and I'm using a push like so:
   items.push([newOption.text, newOption.value]);

Open in new window


How would I retrieve it server side in my webservice?

  Public Shared Sub MoveFromL1toL2(ByVal ids As String())
        Dim currentValue As String() = CType(HttpContext.Current.Session("L1toL2"), String())

Open in new window


I've tried this server side:
    Public Shared Sub MoveFromL1toL2(ByVal ids(,) As String())

Open in new window


But not sure how to proceed after that?
Here's my complete webmethod:

  Public Shared Sub MoveFromL1toL2(ByVal ids(,) As String())
        Dim currentValue As String() = CType(HttpContext.Current.Session("L1toL2"), String())
        If Not currentValue Is Nothing Then

            Dim cVal As List(Of String)
            cVal = currentValue.ToList()
            cVal.AddRange(ids.ToList())
        Else
            HttpContext.Current.Session.Add("L1toL2", ids)
        End If

    End Sub

Open in new window


Suggestions?
For the complete previous issue, please see this post:
https://www.experts-exchange.com/questions/29120361/Retrieving-ListBox-selected-data-client-side-failing.html


thanks!
0
5 Comments

JavaScript

121K

Solutions

109

Content

i
The collection of articles, videos, and posts on this topic.

42K

Contributors

JavaScript is a dynamic, object-based language commonly used for client-side scripting in web browsers. Recently, server side JavaScript frameworks have also emerged. JavaScript runs on nearly every operating system and  in almost every mainstream web browser.