How to get the HTML text box value to show alert message in office share point.
function show(){
alert('test:' + $("#txtPrice").val());
}
After I have deployed the project from visual studio (successful deploy) and I go to my office share point site the alert is not showed. How can I get the text box value?`
Where you Call your show function?
Have you load jQuery library?
You'd better provide more details for your solution.
Update:
The code is fine, make sure the jQuery library is loaded correctly and try to add your site to trust site to check whether you disable JavaScript for your browser.
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8" />
<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script type="text/javascript">
function show() {
alert('test:' + $("#txtPrice").val());
}
</script>
</head>
<body>
<input id="txtPrice" type="text" />
<input type="button" value="Submit" onclick="show();" id="btnCreate" />
</body>
</html>
Related
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>GeoAR.js demo</title>
<script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-look-at-component#0.8.0/dist/aframe-look-at-component.min.js"></script>
<script src="https://raw.githack.com/AR-js-org/AR.js/master/aframe/build/aframe-ar-nft.js"></script>
</head>
<body style="margin: 0; overflow: hidden;">
<a-scene vr-mode-ui="enabled: false" embedded arjs="sourceType: webcam; debugUIEnabled: false;">
<a-text value="This content will always face you." look-at="[gps-camera]" scale="120 120 120" gps-entity-place="latitude: 42.123456; longitude: 13.230240;"></a-text>
<a-camera gps-camera rotation-reader> </a-camera>
</a-scene>
</body>
</html>
Checked out the example on both my devices. Everything works fine, except few things. One of them, the most annoying for user, is the alert. It looks like in 1 of 10 or even less ticks(or whatever you call it) the device cannot get my location. Even if it's so, I think it’s ok for an entertainment app.
How to disable the alert?
The simple way i can think of is to completely disable all alert by altering alert functionality when the document is "ready."
<script>
document.addEventListener('DOMContentLoaded', function(){ //equivalent to jQuery $('document').ready(function(){})
/* alert("this will show"); */
alert = function(){};
/* alert("ALL alert after this won't show"); */
}, false);
</script>
Once page load google tends graph is getting load under trendsBlock class. In below code once after calling next_fun() complete html code getting render with graph. I need to render inside of trendsBlock.
<html>
<body>
<script type="text/javascript" src="https://ssl.gstatic.com/trends_nrtr/1173_RC01/embed_loader.js"></script>
<div class="trendsBlock">
<script type="text/javascript">
trends.embed.renderExploreWidget("TIMESERIES", {"comparisonItem":[{"keyword":"dbs bank","geo":"IN","time":"2016-10-02 2017-11-02"},{"keyword":"citi bank","geo":"IN","time":"2016-10-02 2017-11-02"}],"category":0,"property":""}, {"exploreQuery":"date=2016-10-02 2017-11-02,2016-10-02 2017-11-02&geo=IN&q=dbs%20bank,citi%20bank","guestPath":"https://trends.google.com:443/trends/embed/"});
</script>
</div>
<button onclick="next_fun()">Click to next trends</button>
<script type="text/javascript">
function next_fun(){
//innerHTML in to class trendsBlock
//?
}
</script>
</body>
</html>
The renderExploreWidgetTo method allows one to embed the charts to any HTML element.
You can look at the below sample code to understand.
function next_fun(){
var divElem = document.getElementById('sampDiv');
trends.embed.renderExploreWidgetTo(divElem,"TIMESERIES", {"comparisonItem":[{"keyword":"dbs bank","geo":"","time":"today 12-m"}],"category":0,"property":""}, {"exploreQuery":"q=dbs%20bank&date=today 12-m","guestPath":"https://trends.google.com:443/trends/embed/"});
}
<html>
<body>
<script type="text/javascript" src="https://ssl.gstatic.com/trends_nrtr/1328_RC04/embed_loader.js"> </script>
<div id='sampDiv'>
</div>
<button onclick="next_fun()">Click to next trends</button>
</body>
</html>
P.S: when I am running the above code in StackOverflow's internal compiler/browser it throws an error.
Error img!!
But works fine otherwise.
I am using Zurb Foundation 5.5.2 and trying to get the range slider to work like on the Foundation web site documentation page for range sliders. The desired functionality is that you click on any location on the bar, and the handle advances to that location. On the Foundation web site kitchen sink page, clicking on the range slider bar does nothing. On this codepen that I use the most basic range slider code, you also cannot click on the bar and get the handle to advance. How do I get this to work?
Here is the Codepen code:
<div class="range-slider" data-slider>
<span class="range-slider-handle" role="slider" tabindex="0"></span>
<span class="range-slider-active-segment"></span>
<input type="hidden">
</div>
Foundation v5.x serie seems not trigger mousemove event when using slider.
Digging into foudantion issues on github I found this:
slider: add support for changing by clicking on the slider without having started to drag from the handle
It strikes me that this feature is only available for future versions of Foundation library such as v5.5.3 or v5.6 (see milestones).
But you can use that rigth now, just copy and past o raw code from github:
https://github.com/zurb/foundation/blob/master/js/foundation/foundation.js
https://github.com/zurb/foundation/blob/master/js/foundation/foundation.slider.js
Just click on "raw" button and save to the local storage.
So it should be work like this:
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/foundation/5.5.2/css/foundation.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/foundation/5.5.2/js/vendor/modernizr.js"></script>
</head>
<body>
<div class="row">
<div class="small-10 medium-11 columns">
<!-- SLIDER START -->
<div class="range-slider" data-slider data-options="display_selector: #sliderOutput3;trigger_input_change: true">
<span class="range-slider-handle" role="slider" tabindex="0"></span>
<span class="range-slider-active-segment"></span>
</div>
<!-- SLIDER END -->
</div>
<div class="small-2 medium-1 columns">
<span id="sliderOutput3"></span>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<!-- Foundation updated -->
<script src="https://raw.githubusercontent.com/zurb/foundation/master/js/foundation/foundation.js"></script>
<script src="https://raw.githubusercontent.com/zurb/foundation/master/js/foundation/foundation.slider.js"></script>
<script>$(document).foundation();</script>
</body>
</html>
all. I'm new to foundation.
I tried to make a dropdown example, but it didn't work at all.
--all.scss--
.test{
#drop2{
#include dropdown-container;
}
}
--test.html--
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<meta content='IE=edge,chrome=1' http-equiv='X-UA-Compatible'>
<title>test</title>
<meta content='' name='description'>
<meta content='width=device-width, initial-scale=1.0' name='viewport'>
<link href='css/all.css' rel='stylesheet' type='text/css'>
</head>
<body>
<div class="test">
<a data-dropdown='drop2' href='#'>Has Content Dropdown</a>
<div class='f-dropdown content' data-dropdown-content id='drop2'>
<p>
Some text that people will think is awesome!
Some text that people will think is awesome!
Some text that people will think is awesome!
</p>
</div>
</div>
<script src='js/modernizr.js' type='text/javascript'></script>
<script src='js/jquery.js' type='text/javascript'></script>
<script src='js/fastclick.js' type='text/javascript'></script>
<script src='js/foundation.js' type='text/javascript'></script>
<script src='js/foundation.dropdown.js' type='text/javascript'></script>
<script type='text/javascript'>
$(document).foundation();
</script>
</body>
</html>
The browser shows the text "Has Content Dropdown", but nothing happens when I click the link.
I wonder that I must misunderstand how to use the dropdown component, but can't find what is wrong.
What's wrong with the program? Please help.
foundation 5.4.6
using Middleman and sass
I'm trying to get a Google AdSense ad to display on my mobile website. I am using Django to serve my web pages and I'm using JQuery Mobile to display and format the content. I've followed these blog instructions on a static html page and the ad shows up fine. When I use the exact same code in my base template, the mobile ad does not show. When I compare the HTML source code they look exactly the same and all the links work exactly the same. Is there something Django injects into the header that would keep the ad from displaying? The HTML source is as follows:
<html>
<head>
<title>Test AdSense</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css"/>
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"></script>
<script type="text/javascript"><!--
google_ad_client = "ca-pub-XXXXXXXXXXXXXXXXXX";
/* LTC MobileHeader */
google_ad_slot = "XXXXXXXXXXXX";
google_ad_width = 320;
google_ad_height = 50;
//-->
</script>
</head>
<body>
<div id="Div1" data-role="page" data-ajax="false">
<header data-role="header" data-position="fixed">
<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script>
<h1>Index Page</h1>
</header>
<section data-role="content">
to Page 2
</section>
<footer data-role="footer" data-position="fixed"></footer>
</div>
</body>
</html>
I decided to upload the code to my staging system system which runs on Ubuntu and the ads show up fine. There is something going on with my development environment which runs on windows that is blocking the call to Google.