JavaScript

119K

Solutions

71

Articles & Videos

41K

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

Hi,
To this
http://my-friend.co/Test_rec4/Default.aspx?userid=mc23

I want to ensure picture file would always appear at the place highlighted below (that is at end of the row/record). What to adjust?

16d.png
0
Salesforce Made Easy to Use
Salesforce Made Easy to Use

On-screen guidance at the moment of need enables you & your employees to focus on the core, you can now boost your adoption rates swiftly and simply with one easy tool.

Hi experts, I would like to know if there's a way to dis-allow the toolbar appear after  downloading the file at the client side. Every time the client side finishes downloading the file, the toolbar will appear with an option "Show all downloads" I want it not to appear after downloading the file. I'm using Google Chrome browser. Is this possible? Any help please.
0
I get the following error that is supposed to create a column is a SharePoint 2013 list.

Request failed. 'FirstName' is an unexpected token. The expected token is '"' or '''. Line 1, position 32.
undefined


Any ideas?

Here's the code:
    function addFields(NewField) {
          
        var clientContext = new SP.ClientContext.get_current();
        var oWebsite = clientContext.get_web();
        //Getting reference to the list
        oList = clientContext.get_web().get_lists().getByTitle('Departmental Square Feet');
        console.log("Got the list");
        // Get filed collection
        var fldCollection = oList.get_fields();

        var f1 = clientContext.castTo(fldCollection.addFieldAsXml('<Field Type="Text" DisplayName='+NewField+' Name='+NewField+' />', true, SP.AddFieldOptions.addToDefaultContentType), SP.FieldText);
        console.log("About to set the field");
        f1.set_title(NewField);
        f1.set_description("sample desc");
        console.log("About to update");
        f1.update();       
       

        clientContext.executeQueryAsync(
            Function.createDelegate(this, this.onQuerySucceeded),
            Function.createDelegate(this, this.onQueryFailed)
            );
    }

    function onQuerySucceeded() {
        alert("List Field Updated");
    }

    function onQueryFailed(sender, args) {
        console.log('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
    }

addFields("FirstName");

Open in new window

0
Oh men!
im trying to implement a carrousel, its done but i need to move the carrousel images to the right in order to fit the original image.

my carrousel code is this
    <div class="container">
        
        <div id="myCarousel" class="carousel slide" data-ride="carousel">
            <!-- Indicators -->
            <ol class="carousel-indicators">
                <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
                <li data-target="#myCarousel" data-slide-to="1"></li>
                <li data-target="#myCarousel" data-slide-to="2"></li>
            </ol>

            <!-- Wrapper for slides -->
          
                <div class="carousel-inner">
                    <div class="item active">
                        <img src="Images/biking.jpg" alt="" >
                    </div>

                    <div class="item">
                        <img src="Images/biking.jpg" alt="" >
                    </div>

                    <div class="item">
                        <img src="Images/biking.jpg" alt="" >
                    </div>
                </div>

                <!-- Left and right controls -->

            </div>
    </div>

Open in new window


The carrousel is the top, the original image is the above i need to align the carrousel images to the one that is behind
please you guys!!!
regards
align.png
0
Hi all

The UI for my react app has a main section (takes up most of the screen) and a left hand side pane.
I'm using 3 separate ag-grids:
-One as the main one on the main screen holding the important data.
-the other two are in the left hand side pane (the less important grids for assistance/statistic holding).

This left pane uses (two) tabs, i.e. click on one tab to see one ag-grid, click the other tab to see the other ag-grid

For the tab functionality, i used npm to install the NPM react-bootstrap-tabs node module.

Recently I managed to set up one of the left pain ag-grids to hold filtering information from the main grid.
This was quite a hassle since the grids were effectively grand-sibling components which needed to communicate. without touching AG-grid src code, I had to set up ag-grid callbacks to take note of the filtering data from the main ag-grid, send it up to the grandparent component of my app, and then send it back down to the other grand child ag-grid component.

It all works however I noticed a glitch. When initially loading the whole page, the first tab in the left pane is active by default. The left pane ag-grid that holds the filter information is in the second tab. What I want is to click on this second tab, and see filter data be populated automatically as i filter the main ag-grid. However when I have the second tab active and i filter the main ag-grid (i.e. adding filter …
0
Hi experts, I wish to do Full screen event using button, that every time I press the button will do full screen just like the F11 on the keyboard. Help please!

<!DOCTYPE html>
<html>
<body>
<button size="25" onclick="return FullSreen()">F11 - Full Screen</button><br/><br/>
<script>
function FullSreen() 
{
  //Do FullScreen here
}
</script>
</body>
</html>

Open in new window

0
After upgrading to Coldfusion 16 some of the functions with my grids do not work.

I use the below code to open records on double click in the grid, and to put a total count in the grid. Neither is working and when I visit the page the debugger says carGrid is undefined. Can anyone assist?

	<script>			
		function initMyGrid(){
			carGrid = ColdFusion.Grid.getGridObject('myGrid');
			carGrid.on('dblclick', openCarRecord);	
		}
	
		function openCarRecord(){
			var recID= ColdFusion.getElementValue('frmGrid','myGrid','#varIDNumber#');
			var url = '#recordPage#?myKEY='+recID;
			location.href = url;
		}
		
	    var gridRender = function(){
		carGrid = ColdFusion.Grid.getGridObject('myGrid');
	        carGrid.store.on('load', function( ds ) {
	        carGrid.setTitle('Total records: '+ carGrid.store.getTotalCount());
	        }); 
	    };   
	</script>

Open in new window

0
Please I need any alternative solution to how to edit and save an entry on a typical profile page data. Below is my current code which works fine until when the text entry on any of my field contains an apostrophe. So in the code below, I'm using the text entry as the ID for the input element. Anything I click on the edit button to edit the entry, this line of my code brings up an editable field of the text -
document.getElementById(nameid).innerHTML = "<input type='text' value='" + name + "' id='" + txtnameid + "'>";

Open in new window

But instead of having the full text of - I'm a photographer in the editable field, I will only see the first letter of the string which is letter I
The remaining text don't show up, and when i click on the save button, I get the error - Uncaught TypeError: Cannot read property 'value' of null at save3 (functions.js:502)
This is because of the apostrophe in my text which I'm using as my input ID.
Is there any other way I can write this code that won't involve using text input as my ID? Thanks all.

<?php
$aboutme = 'I'm a photographer';
echo '<div id="name3<?php echo $aboutme; ?>"><?php echo $aboutme; ?> </div>';
echo '<input type="button" id="<?php echo $aboutme; ?>" name="<?php echo $aboutme; ?>" value="Edit" onclick="edit3(this.id)">';
echo '<input type="button" id="save3<?php echo $aboutme; ?>" class="saveBtn" name="<?php echo $aboutme; ?>" value="Save" style="visibility:hidden" onclick="save3(this.name);">';
?>

Open in new window


JavaScript
Function for edit button
function edit3(id) {
    nameid = "name3" + id;
    txtnameid = "txtname" + id;
    var name = document.getElementById(nameid).innerHTML;
    document.getElementById(nameid).innerHTML = "<input type='text' value='" + name + "' id='" + txtnameid + "'>";

    updateid = "save3" + id;
    
    document.getElementById(id).style.visibility = "hidden";
    document.getElementById(updateid).style.visibility = "visible";
    
}

Open in new window


Function for save button


Open in new window

0
Imagine you have a text and that each and every word is an anchor link. When you click on one word, the dictionary pops up. This has been already implemented, and seems to work quite fine.

Now, the problem is that I would like users to be able to select phrases too. I have thought of this to work as follows:

1. click on one anchor element (not necessarily at the beginning of the word)
2. drag (and show current selection progress somehow)
3. drop on another anchor element

Any ideas on how to implement this using jQuery and HTML5?
1
I need to integrate Google Adwords Conversions code https://support.google.com/adwords/answer/6331304?hl=en&authuser=0

How should I add the below code...

<!-- Google Code for Adwords - Contact Us Conversion Page
	In your html page, add the snippet and call
	goog_report_conversion when someone clicks on the
	chosen link or button. -->
	<script type="text/javascript">
	  /* <![CDATA[ */
	  goog_snippet_vars = function() {
		var w = window;
		w.google_conversion_id = 857015425;
		w.google_conversion_label = "hjP2CL3P6G8QgYnUmAM";
		w.google_remarketing_only = false;
	  }
	  // DO NOT CHANGE THE CODE BELOW.
	  goog_report_conversion = function(url) {
		goog_snippet_vars();
		window.google_conversion_format = "3";
		var opt = new Object();
		opt.onload_callback = function() {
		if (typeof(url) != 'undefined') {
		  window.location = url;
		}
	  }
	  var conv_handler = window['google_trackConversion'];
	  if (typeof(conv_handler) == 'function') {
		conv_handler(opt);
	  }
	}
	/* ]]> */
	</script>
	<script type="text/javascript"
	  src="//www.googleadservices.com/pagead/conversion_async.js">
	</script>

Open in new window


into this code so the conversion gets registered.

$(document).ready(function() {
	
	$('#contact-form').formValidation({
		
		// live: 'enabled', // Default value
		trigger: 'input change keyup'
		
	}).on('success.form.fv', function(e) {
		
		$.post("contact_script.php", {
					first_name: $("#first-name").val(),
					last_name: $("#last-name").val(),
					company: $("#company").val(),
					email: $("#email").val(),
					phone: $("#phone").val(),
					message: $("#message").val()
        		}, function(data) {
					$("#contact-form").hide();
					$("#contact-success").html(data).show();
					$('html, body').animate({scrollTop: $("#contact-success").offset().top - 100}, "fast");
		});
		
    });
		
});

Open in new window

0
Transaction Monitoring Vs. Real User Monitoring
LVL 1
Transaction Monitoring Vs. Real User Monitoring

Synthetic Transaction Monitoring Vs. Real User Monitoring: When To Use Each Approach? In this article, we will discuss two major monitoring approaches: Synthetic Transaction and Real User Monitoring.

hi
i have a method that manipulate a canvas image to add noise. it does work but it freezes the browser for at least a minute and a half.
the amount is set while dragging a slider. again work but obviously doesn't give a good user experience. maybe there is a way to make it perform better, to optimize it?

here is the method:
  setNoise(opacity){

    opacity = opacity || .2;

    for (var x = 0; x < this.thecanvas.width; x++ ) {
        for (var y = 0; y < this.thecanvas.height; y++ ) {
          let number = Math.floor( Math.random() * 60 );
  
          this.thecontext.fillStyle = "rgba(" + number + "," + number + "," + number + "," + opacity + ")";
          this.thecontext.fillRect(x, y, 1, 1);
        }
    }

    let dData = this.getData();
    this.setData(dData)
  }

Open in new window

0
Hello nodejs experts

Is there is anything more on node js standards?  


All urls must be in lower case

Ex: /notification/sendotp

Use HTTP verbs (GET, POST, PUT, DELETE) to operate on the collections and elements.

Use GET – for retrieving single or list data

Use POST – for create data

Use PUT – for update data

Use DELETE – for delete data

HTTP METHOD

POST

GET

PUT

DELETE

CRUD OP

CREATE

READ

UPDATE

DELETE


URLs should include nouns, not verbs in API names. Avoid get,update,save, delete, list in API names.

Maintain singular and plural nouns for APIs.

Ex: for single image retrive – GET - /user/image

For list of images – GET – user/images

User Token must be in headers only. Not as path param or in json body

Use resource, sub-resources for relations

Ex: for user videos use - /user/videos

Put the version number at the base of your URL. /v1/user/images

Controller will have only mandatory parameter validations and sending success, error responses no business logic. Use Service and Helper files for business logic. DAO for db calls

Handle Errors with HTTP status codes

200 – OK – Everything is fine. Created, Saved, Data found

400 – Validations Failed, Missing Mandatory Params, No data found, User already exists, already voted, in valid comment, comment not allowed within a hour, invalid user, invalid video, Video not found

500 – Unknown error, Database error, ES down, timeout from third-party. …
0
Hi, It seems to me that everything is set up correctly, and yet I am not getting a result with this.

I looked over this and all seems to be right. https://mozilla.github.io/nunjucks/templating.html#template-inheritance

But when I try to use it, it does't work. I'm going to upload the relevant files here for you to look at. The problem lies in trying to add meta tags. See my expectations below the files.

src/pages/full-width.html:
full-width.html

src/templates/layout.html:
layout.html

src/templates/partials/head.html:
head.html

dev/gulp/gulpfile.js:
gulpfile.js

My expectation is this: 1. On fullwidth.html, I make this change:

From:
{% block title %}Site - Home Title{% endblock %}
{% block description %}Site - Home Description{% endblock %}

To:
{% block title %}Meal Plans, Healthy Prepared Meal Plans Home Delivery {% endblock %}
{% block description %}Our site offers the best flexible meal program with a satisfaction guarantee. Getting delicious meals delivered to your home has never been easier.{% endblock %}

2. I run gulp nunjucks, and a new file appears in src:  fullwidth.html. This file has two metatags:
<title>Meal Plans, Healthy Prepared Meal Plans Home Delivery </title>
<meta name="description"  content="Our site offers the best flexible meal program with a satisfaction guarantee. Getting delicious meals delivered to your home has never been easier.">

However, what I get is this(although …
0
I keep getting "this stylesheet is too minified to process," but all my css stylesheets are internal and not minified. I tried the solution above (allow JavaScript) but the only option I find is 'disable JS when spydering,' which didn't make any difference. Trouble is, Dust-me doesn't tell which stylesheet has a problem... Any advice?
0
I have a requirement to develop a solution to enable the administrator to set edit permissions on Ms Word based on the user logged on.

The solution will be hosted by SharePoint 2013 using Office Co authoring. The document must be edited by many users at the same time and each user must only edit the section the admins have configured the user to edit.

Does anyone have any idea how to allow the administrator to set the permissions? Then dynamically disable/enable controls based on template name and user logon on MS Word 2016 using JavaScript API for Word.

The client does not want to use the option available out of the box to restrict edit using passwords because it is easy to crack the password.

http://www.c-sharpcorner.com/UploadFile/8ea152/set-and-remove-editing-restrictions-in-word-2013-documents/

I have looked at the link below but my problem is to disable/enable the controls dynamically without hard cording the controls or users.

https://xomino.com/2017/03/29/office-add-ins-javascript-control-over-the-content-control-lock-in-a-word-document/
0
I have a form in  razor view (see sample code below). In the form tag, i have specified controller action method, that will be called when form is posted. I want to validate user input, when user clicks on search button. and if there are any errors in user input, prevent the form posting and display errors.

I can create a javascript/jquery function to check for user input validation. how should i call the this function and how can i prevent the form submission, if there are any errors?


--default.cshtml
 <form id="defaultForm" method="post" action="controllerMethod">

<input type="submit" id="searchBtn" value="Search" />
......
</form>
 <script type="text/javascript">
</script>
1
The sub menus no longer work after fixing dynamic margin for vertical menu.  Please see example at  jsfiddle.net/70qpqg2f/5
0
Hi,

When I try to login to to Google on my PC using ANY of the latest browsers (Chrome, Firefox, Opera etc) I am able to enter my username but when I press the "NEXT" button nothing happens.  I added a screenshot of the page that I am stuck on here:  http://i.imgur.com/zMpNrFM.jpg and the link I am stuck on is below.    The link that i am stuck on is https://accounts.google.com/signin/v2/identifier?hl=en&%3B&flowName=GlifWebSignIn&flowEntry=ServiceLogin

If I use an old Safari browser that is unsupported or I add a Script Blocker to one of the new browsers (like NoScrip) then I get the old Google V1 Login page and I can login with no problems. See image: http://i.imgur.com/A9YlIYy.jpg

Can someone help me figure out how to fix this issue?

Sincerely,

David S.
0
I'm using a Chrome browser and I noticed something weird on one of our sub-domains. if I clear or change local storage, when I refresh the page, the old settings are restored. I have tried to clear at the command line, via Application > Storage > localStorage and Application > storage (hit clear). Regardless I have no idea how to prevent this or get around this issue. Is this an application setting?
0
Technology Partners: We Want Your Opinion!
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

I need to write a rule in my apache htaccess file to redirect:

/insurance-plans/year/schools/international-student-plans-2015?s=136&l=5000
to:
http://%{SERVER_NAME}/insurance-plans/year/schools/international-student-plans-2017?s=136&l=7000

The rule I wrote is as follows, but it does nothing:

RewriteRule ^insurance-plans\/year\/schools\/international-student-plans-2015?s=136&l=5000$		http://%{SERVER_NAME}/insurance-plans/year/schools/international-student-plans-2017?s=136&l=7000	[R=301,L,NC,NE]

Open in new window


I'd be grateful if someone would show me the correct htaccess code to implement my redirect.

Thanks,
Jon
0
I'm looking for a way to asynchronously load the contents of a whole div. I'd like to delay the loading of everything in the div. Right now, everything is loaded all at once and it's not bandwidth efficient.

https://codepen.io/anon/pen/GENGJW
0
Good Evening,

I have a form that needs to be 508 compliant --  Accessibility.  The form has 1 dropdown and one file input after the dropdown has a value selected and using the tab key how would I set the focus o the input part of the fileupload file type so as not to fail 508.  Tabbing now the focus skips over the input and snags the browse button but if the user then hits enter it triggers validation rather than the window asking for the file to choose.

Someone please help I am very new to 508 and work for the government so this will have to be 508 compliant to get to production.  I have tried focusout onchange and a couple of others but I know I am not doing it accurately.
0
I am using Modernizr to detect if autoplay is available in the browser. Then, I am displaying either a video or a Javascript-based slide show depending on the result. Here is my code:

videoAutoPlayCheck=setInterval(videoCheckAutoPlay, 1000);
videoCheckAutoPlay();

function videoCheckAutoPlay(){
	Modernizr.on('videoautoplay', function(result){
		if (Modernizr.videoautoplay){
			//PLAY VIDEO
			window.clearInterval(videoAutoPlayCheck);
		} else {
			//PLAY SLIDE SHOW
			window.clearInterval(videoAutoPlayCheck);
		}
	});
}

Open in new window


I am getting unpredictable results in Chrome, however this seems to be working in all other browsers. Researching the issue on Google, there are posts from a couple years ago describing what I am seeing. However, I would have thought that enough time has passed that Modernizr would have fixed that issue.

To describe what is happening, sometimes Chrome loads the video, sometimes the slide show. There doesn't seem to be any way to predict... in fact, sometimes reloading the page brings the opposite result as the previous page load.

Is there anything wrong with my code, or is this still a known issue with Modernizr? Or should I be looking for some other solution?

Thank you.
0
plz help
0
Hi,
I have tried to put together a simple responsive slider on the home page here http://www.peterlane.co.uk.gridhosted.co.uk/

Here is the code in my header...
<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
<script src="<?php bloginfo( 'template_url' ); ?>/js/responsiveslides.min.js"></script>

Open in new window


This is what I have on the page...
<div class="rslides-container">
				<ul class="rslides">
				  <li><img src="<?php bloginfo( 'template_url' ); ?>/images/slider/highbourne.jpg" alt=""></li>
				  <li><img src="<?php bloginfo( 'template_url' ); ?>/images/slider/6-bed-house.jpg" alt=""></li>
				</ul>
			</div><!---rslides container--->

Open in new window


and this is what I have in my footer....
<script>
  jQuery(function($) {
   $(".rslides").responsiveSlides({
  auto: false,          // Boolean: Animate automatically, true or false
  pager: true           // Boolean: Show pager, true or false
});
  });
	 
	  
</script>

Open in new window


Can't seem to get it to work at all.

Any help would be much appreciated.

Many Thanks,

Andrew
0

JavaScript

119K

Solutions

71

Articles & Videos

41K

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.