please can anyone help me with this problem that i've encountered. i'm able to capture a url parameter with javascript and i want to add it to my jquery code which calls a page in a div but i'm able to do it. here's my code:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script language="javascript" type="text/javascript">
function urlink()
{
var tlink = window.location.search.substring(1);
}
jQuery(function($){
$('#mydiv').load('real_news.asp?'+ urllink());
});
</script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script language="javascript" type="text/javascript">
function urlink()
{
return window.location.search.substring(1);
}
jQuery(function($){
$('#mydiv').load('real_news.asp?'+ urllink());
});
</script>
Related
I am trying to get Kendo Ui (Free Version working). I am trying to implement the date picker with the below code but alls I get is an empty input field. Does anyone have any suggestions on how to resolve this?
<!DOCTYPE html>
<html>
<head>
<link href="/Content/kendo/2015.3.1111/kendo.common.min.css" rel="stylesheet" />
<link href="/Content/kendo/2015.3.1111/kendo.default.min.css" rel="stylesheet" />
</head>
<body>
<script src="/Scripts/jquery-1.10.2.js"></script>
<script src="/Scripts/kendo/2015.3.1111/kendo.core.min.js"></script>
<script src="/Scripts/kendo/2015.3.1111/kendo.calendar.min.js"></script>
<script src="/Scripts/kendo/2015.3.1111/kendo.popup.min.js"></script>
<script src="/Scripts/kendo/2015.3.1111/kendo.datepicker.min.js"></script>
<script src="/Scripts/kendo/2015.3.1111/kendo.data.min.js"></script>
<script src="/Scripts/kendo/2015.3.1111/kendo.list.min.js"></script>
<script src="/Scripts/kendo/2015.3.1111/kendo.combobox.min.js"></script>
<script src="/Scripts/kendo/2015.3.1111/kendo.dropdownlist.min.js></script>
<script src="/Scripts/kendo/2015.3.1111/kendo.multiselect.min.js"></script>
<script src="/Scripts/kendo/2015.3.1111/kendo.validator.min.js"></script>
<input id="TimeSlot" name="TimeSlot" type="datetime" />
<script type="text/javascript">
$(document).ready(function () {
debugger;
$("#TimeSlot").kendoDatePicker();
//var datepicker = $("#datepicker").data("kendoDatePicker");
});
</script>
</body>
</html>
You need to reference all these javascript files in order for the DatePicker to work. You can use the Kendo UI Custom Download tool to find out which javascript files you need to reference and to download a custom javascript file that contains everything you need:
<script src="http://kendo.cdn.telerik.com/2015.3.1111/js/kendo.core.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2015.3.1111/js/kendo.calendar.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2015.3.1111/js/kendo.popup.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2015.3.1111/js/kendo.datepicker.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2015.3.1111/js/kendo.data.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2015.3.1111/js/kendo.list.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2015.3.1111/js/kendo.combobox.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2015.3.1111/js/kendo.dropdownlist.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2015.3.1111/js/kendo.multiselect.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2015.3.1111/js/kendo.validator.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2015.3.1111/js/kendo.aspnetmvc.min.js"></script>
UPDATE:
Your text-box's id is "TimeSlot", but in your script you're referring to #datepicker which doesn't even exist. Change your script to this:
<script type="text/javascript">
$(document).ready(function () {
$("#TimeSlot").kendoDatePicker();
//var datepicker = $("#TimeSlot").data("kendoDatePicker");
});
</script>
By the way, you won't need kendo.aspnetmvc.min.js if you don't want to use Kendo's Html Helpers, which is not something that I would recommend if you are using asp.net MVC. With kendo.aspnetmvc.min.js, you wouldn't even need the script, you could just replace your text-box (input tag) with this:
#(Html.Kendo().DatePicker().Name("TimeSlot"))
I would like to combine the two JavaScript libraries/frameworks/scripts scriptaculous.js and validationEngine.jquery but I don’t have a clue how to do it.
My code is like this:
<head>
...
// auto complete
<script src="prototype.js" type="text/javascript"></script>
<script src="scriptaculous.js" type="text/javascript"></script>
// validation
<script type="text/javascript" src="query-1.9.1.js"></script>
<script type="text/javascript" src="jquery.validationEngine.js"></script>
<script type="text/javascript" src="jquery.validationEngine-de.js"></script>
// auto complete
<script type="text/javascript">
Event.observe(window, 'load', function() {
new Ajax.Autocompleter('architect', 'suggestion', ‚'ArchitectQuery.php', {minChars: 3});
});
</script>
// validation
<script type="text/javascript">
$(document).ready(function(){
$("#form-validation").validationEngine();
});
</script>
...
</head>
<body>
...
<input type="text" name="architect" size="45" maxlength="100" id="architect" data-validation-engine="validate[required, minSize[3]]" />
<div id="suggestion"></div>
...
</body>
I guess I have to somehow add the ‚Event.observe‘ part to the validationEngine - but how?
Thanks
Kashuda
First of all, you have to use $.noConflict();, because prototypejs use also $.
<script type="text/javascript">
$.noConflict();
jQuery( document ).ready(function( $ ) {
$("#form-validation").validationEngine();
});
Domus71
I'm looking at the PDF.js project on github and looking at their basic demos I've come up with this (the whole view):
#{
ViewBag.Title = "GetPDFLetter";
Layout = null;
}
<!doctype html>
<html>
<head>
<title>PDF.JS TEST</title>
<!-- PDF.js-specific -->
<script src="#Url.Content("~/Scripts/jquery-1.8.2.min.js")" type="text/javascript"></script>
<script type="text/javascript" src="#Url.Content("~/PDFScripts/pdf.js")"> </script>
<script type="text/javascript" src="#Url.Content("~/PDFScripts/core.js")"> </script>
<script type="text/javascript" src="#Url.Content("~/PDFScripts/util.js")"> </script>
<script type="text/javascript" src="#Url.Content("~/PDFScripts/api.js")"> </script>
<script type="text/javascript" src="#Url.Content("~/PDFScripts/canvas.js")"> </script>
<script type="text/javascript" src="#Url.Content("~/PDFScripts/obj.js")"> </script>
<script type="text/javascript" src="#Url.Content("~/PDFScripts/function.js")"> </script>
<script type="text/javascript" src="#Url.Content("~/PDFScripts/charsets.js")"> </script>
<script type="text/javascript" src="#Url.Content("~/PDFScripts/cidmaps.js")"> </script>
<script type="text/javascript" src="#Url.Content("~/PDFScripts/colorspace.js")"> </script>
<script type="text/javascript" src="#Url.Content("~/PDFScripts/crypto.js")"> </script>
<script type="text/javascript" src="#Url.Content("~/PDFScripts/evaluator.js")"> </script>
<script type="text/javascript" src="#Url.Content("~/PDFScripts/fonts.js")"> </script>
<script type="text/javascript" src="#Url.Content("~/PDFScripts/glyphlist.js")"> </script>>
<script type="text/javascript" src="#Url.Content("~/PDFScripts/image.js")"> </script>
<script type="text/javascript" src="#Url.Content("~/PDFScripts/metrics.js")"> </script>
<script type="text/javascript" src="#Url.Content("~/PDFScripts/parser.js")"> </script>
<script type="text/javascript" src="#Url.Content("~/PDFScripts/pattern.js")"> </script>
<script type="text/javascript" src="#Url.Content("~/PDFScripts/stream.js")"> </script>
<script type="text/javascript" src="#Url.Content("~/PDFScripts/worker.js")"> </script>
<script type="text/javascript" src="#Url.Content("~/PDFScripts/jpg.js")"> </script>
<script type="text/javascript" src="#Url.Content("~/PDFScripts/jpx.js")"> </script>
<script type="text/javascript" src="#Url.Content("~/PDFScripts/jbig2.js")"> </script>
<script type="text/javascript">
// Specify the main script used to create a new PDF.JS web worker.
// In production, change this to point to the combined `pdf.js` file.
var url = '#Url.Content("~/PDFScripts/worker_loader.js")';
PDFJS.workerSrc = url;
</script>
</head>
<div>
<canvas id="the-canvas" style="border:1px solid black"></canvas>
</div>
<script type="text/javascript">
$(document).ready(function () {
/* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
/* vim: set shiftwidth=2 tabstop=2 autoindent cindent expandtab: */
//
// See README for overview
//
'use strict';
//
// Fetch the PDF document from the URL using promices
//
PDFJS.getDocument('helloworld.pdf').then(function (pdf) {
// Using promise to fetch the page
pdf.getPage(1).then(function (page) {
var scale = 1.5;
var viewport = page.getViewport(scale);
//
// Prepare canvas using PDF page dimensions
//
var canvas = document.getElementById('the-canvas');
var context = canvas.getContext('2d');
canvas.height = viewport.height;
canvas.width = viewport.width;
//
// Render PDF page into canvas context
//
var renderContext = {
canvasContext: context,
viewport: viewport
};
page.render(renderContext);
});
});
});
</script>
</html>
The File helloworld.pdf is in the same folder as the view, but when I run the project nothing gets rendered, just a small rectangle. Have I missed something? Any special considerations? Thanks for any help.
Figured it out eventually. What an awesome library PDF.js is.
I've taken the liberty of creating a sample MVC3 project using PDF.js. It follows 90% of the PDF.js demo on github, except a tiny, self explanatory (explained in the comments in the code) change in assigning PDF file paths to the viewer.
I'm working on an MVC3 project right now and just started using SignalR.
I have followed several demos but I can't seem to get it working when my codes are inside \Views\Shared_Layout.cshtml. I always get the "Connection must be started before data can be sent." error.
Please see my codes below:
My Class:
[HubName("notificationsHub")]
public class NotificationsHub : Hub
{
public void updateServer()
{
Clients.updateClient("boom");
}
}
My script inside _Layout.cshtml:
$(function(){
var signalR = $.connection.notificationsHub;
signalR.updateClient = function (message) {
alert(message);
};
$("#open").click(function () {
signalR.updateServer();
});
$.connection.hub.start(function () {
alert("Connected");
});
});
Script references:
<script type="text/javascript" src="#Url.Content("~/Scripts/jquery-1.6.4.js")"></script>
<script type="text/javascript" src="#Url.Content("~/Scripts/jquery.signalR.js")"></script>
<script type="text/javascript" src="#Url.Content("~/signalr/hubs")"></script>
My NotificationsHub Class is inside a folder named NotificationsHub which is of the same directory level as my Views.
I tried this on a .html file and it works perfectly (I get the alert callback for $.connection.hub.start).
What am I missing here?
Thanks
That's weird, I cannot reproduce the problem. Here's my Layout:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>#ViewBag.Title</title>
<script type="text/javascript" src="#Url.Content("~/Scripts/jquery-1.6.4.js")"></script>
<script type="text/javascript" src="#Url.Content("~/Scripts/jquery.signalR.js")"></script>
<script type="text/javascript" src="#Url.Content("~/signalr/hubs")"></script>
<script type="text/javascript">
$(function () {
var signalR = $.connection.notificationsHub;
signalR.updateClient = function (message) {
alert(message);
};
$("#open").click(function () {
signalR.updateServer();
});
$.connection.hub.start(function () {
alert("Connected");
});
});
</script>
</head>
<body>
#RenderBody()
Open
</body>
</html>
Works perfectly fine. Make sure you don't have script reference errors.
I want to use the Ajax.BeginForm, without updating any element, only call the callback javascript function.
I've attached js libraries
<script src="#Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
I use:
#using (Ajax.BeginForm(new AjaxOptions {OnComplete = "AddPostComplete"}))
{
//some code
}
and
<script type="text/javascript">
$('#asdf').click(function () {
//some code
});
</script>
the js function isn't used, and the page return full view.
With unobtrusive javascript enabled you will also need to include jquery.unobtrusive-ajax.min.js