I'm having a problem using autocomplete in conjunction with other javascript libraries that I need in my project.
When I run this simple example it works fine in the first time. It shows the autocomplete window perfectly, but if I try to change the word I'm typing it generates this error in Chrome:
Uncaught ReferenceError: pos is not defined on the file jquery-1.4.4-vsdoc.js:2495
This is the code:
$(function () {
var availableTags = [
"ActionScript",
"AppleScript",
"Asp",
"BASIC",
"C",
"C++",
"Clojure",
"COBOL",
"ColdFusion",
"Erlang",
"Fortran",
"Groovy",
"Haskell",
"Java",
"JavaScript",
"Lisp",
"Perl",
"PHP",
"Python",
"Ruby",
"Scala",
"Scheme"
];
$("#txtPesquisar").autocomplete({
source: availableTags
});
});
and I lead all these javascripts in my master page for my project.
I don't know why I get this error.
<link href="<%= Url.Content("~/Content/jquery-ui-1.10.1.custom.css") %>" rel="stylesheet" type="text/css" />
<script src="<%= Url.Content("~/Scripts/jquery-1.9.1.js") %>" type="text/javascript"></script>
<script src="<%= Url.Content("~/Scripts/jquery-1.4.4-vsdoc.js") %>" type="text/javascript"></script>
<script src="<%= Url.Content("~/Scripts/Utils.js") %>" type="text/javascript"></script>
<script src="<%= Url.Content("~/Scripts/jquery.form.js") %>" type="text/javascript"></script>
<script src="http://maps.googleapis.com/maps/api/js?sensor=false" type="text/javascript"></script>
<script src="<%= Url.Content("~/Scripts/jquery-ui.js")%>" type="text/javascript"> </script>
<script src="<%= Url.Content("~/Scripts/JuridicOffice.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>
<script src="<%= Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js") %>" type="text/javascript" ></script>--%>
<script src="<%= Url.Content("~/Uploadify/swfobject.js") %>" type="text/javascript"></script>
<script src="<%= Url.Content("~/Uploadify/jquery.uploadify.v2.1.4.min.js") %>" type="text/javascript"></script>
<script src="<%= Url.Content("~/Scripts/jgcharts.js") %>" type="text/javascript"></script>
<script src="<%= Url.Content("~/Scripts/Mascara.js") %>" type="text/javascript"></script>
<script src="<%= Url.Content("~/Scripts/jquery.maskedinput-1.3.js") %>" type="text/javascript"></script>
<script src="<%= Url.Content("~/Scripts/jquery.color.js") %>" type="text/javascript"></script>
<script src="<%= Url.Content("~/Scripts/jquery.Jcrop.min.js") %>" type="text/javascript"></script>
I red something here in the forum it could be a postback functions but I don't know how to figure it out.
Thanks for your help
did you notice? the file vsdoc it's a little bit older than jQuery version, even you should remove the vsdoc.js from the runtime version.
if open the vsdoc you can find with this note.
/*
* This file has been commented to support Visual Studio Intellisense.
* You should not use this file at runtime inside the browser--it is only
* intended to be used only for design-time IntelliSense. Please use the
* standard jQuery library for all production use.
*
* Comment version: 1.4.4a
*/
Related
I can find several tutorials on how to render stl files to something that looks like thingiverse renderings but I can't seem to get anything to work on a windows machine. Anyone know how I can do this?
Well someone obviously doesn't like the question but I am sure others have had the problem so here is how I solved it.
I created a web page that rendered the image using jsc3d
<html>
<header>
<link rel="stylesheet" href="/web_inc/all.css">
<script type="text/JavaScript" src="/web_inc/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="/web_inc/jquery.form.min.js"></script>
<link rel="stylesheet" href="/web_inc/bootstrap.min.css">
<link rel="stylesheet" href="/web_inc/bootstrap-theme.min.css">
<script type="text/javascript" src="/web_inc/bootstrap.min.js"></script>
<script type="text/javascript" src="/web_inc/jsc3d.js"></script>
<script type="text/javascript" src="/web_inc/jsc3d.console.js"></script>
<script type="text/javascript" src="/web_inc/jsc3d.webgl.js"></script>
<script type="text/javascript" src="/web_inc/jsc3d.touch.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var canvas = document.getElementById('cv');
canvas.width=1200;
canvas.height=900;
var viewer = new JSC3D.Viewer(canvas);
viewer.setParameter('SceneUrl', '/model/1.stl');
viewer.setParameter('InitRotationX', 0);
viewer.setParameter('InitRotationY', 30);
viewer.setParameter('InitRotationZ', 0);
viewer.setParameter('ModelColor', '#57524C');
viewer.setParameter('BackgroundColor1', '#FFFFFF');
viewer.setParameter('BackgroundColor2', '#999999');
viewer.setParameter('RenderMode', 'flat');
viewer.setParameter('MipMapping', 'on');
viewer.setParameter('Renderer', 'webgl');
viewer.setParameter('Definition', 'high');
viewer.init();
viewer.update();
});
function savePreview() {
var canvas = document.getElementById("cv");
$("#imageData").val(canvas.toDataURL("image/png"));
$("#uploadForm").ajaxSubmit({url: '/ajax_update_sim.php', type: 'post'});
}
</script>
</header>
<body>
<canvas id="cv" class="viewerCanvas"></canvas>
<form action="/ajax_upload_sim.php" method="post" enctype="multipart/form-data" id="uploadForm">
<input type="hidden" name="id" value="1">
<input type="hidden" name="data" id="imageData">
</form>
<input type="button" class="button" value="Save Preview" onclick="savePreview();"/>
</body>
</html>
I then created a php file to save the results
$src="img/1.png"
file_put_contents($src, base64_decode(explode(",", $_REQUEST['data'])[1]));
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 am also trying the above code locally.
here is the code:
<html>
<head>
<script type="text/javascript" src="../JQuery/excanvas.js"></script>
<script type="text/javascript" src="../JQuery/jquery.js"></script>
<script type="text/javascript" src="../JQuery/jquery.jqplot.js"></script>
<script type="text/javascript" src="../JQuery/jqplot.categoryAxisRenderer.min.js"></script>
<script type="text/javascript" src="../JQuery/jqplot.barRenderer.js"></script>
<script type="text/javascript" src="../JQuery/jqplot.categoryAxisRenderer.min.js"></script>
<script type="text/javascript" src="../JQuery/jqplot.canvasTextRenderer.min.js"></script>
<script type="text/javascript" src="../JQuery/jqplot.canvasAxisLabelRenderer.min.js"></script>
<link rel="stylesheet" type="text/css" href="../JQuery/jquery.jqplot.css" />
<script type="text/javascript">
$(document).ready(function(){
var plot1 = $.jqplot ('chart3', [[3,7,9,1,4,6,8,2,5]]);
});
</script>
</head>
<body>
<div id="chart3" style="width:400px; height:300px;"></div>
</body>
</html>
But when I run this code, it gives me javascript error for "excanvas.js" file. like "parentnode" is null or not an object. I am using IE8.
I tried the code and it works fine.
To be 100% honest I run it in ie9 with compatibility mode of ie8, then ie7 (since I update my browsers regularly, I recommend doing the same and asking clients to do the same as well) and it works fine.
The only issue I might expect you can have here is that these scripts:
<script type="text/javascript" src="../JQuery/jqplot.categoryAxisRenderer.min.js"></script>
<script type="text/javascript" src="../JQuery/jqplot.barRenderer.js"></script>
<script type="text/javascript" src="../JQuery/jqplot.categoryAxisRenderer.min.js"></script>
<script type="text/javascript" src="../JQuery/jqplot.canvasTextRenderer.min.js"></script>
<script type="text/javascript" src="../JQuery/jqplot.canvasAxisLabelRenderer.min.js"></script>
... are located in plugins folder which you should have if you downloaded the jqPlot from their site.
To test quickly if this is the issue you can simple delete the aforementioned scripts and the code should work just fine as it is not using them at all.
I try to use jQueryUIHelpers.Mvc3 but when i click on the box the datebox picker not appear.
I installed the jqueryUIHelpers.Mvc 3 package like here http://jqueryuihelpers.apphb.com/Docmo/Overview/GettingStarted
But when i am running the page and click the date box nothing appears.
Here is my view:
#model MvcApplication4.Models.Reservation
#using JQueryUIHelpers
#{
ViewBag.Title = "Create";
}
<head>
<h2>Create</h2>
<title>jQuery UI Helpers - #ViewBag.Title</title>
<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>
<link href="#Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/Content/themes/base/jquery.ui.all.css")" rel="stylesheet" type="text/css" />
<script src="#Url.Content("~/Scripts/jquery-1.7.1.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery-ui-1.8.18.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery-ui.unobtrusive.min.js")" type="text/javascript"></script>
</head>
#using (Html.BeginForm()) {
#Html.ValidationSummary(true)
<fieldset>
<legend>Reservation</legend>
<div>
<label for="anotherDate">Select another date: </label>
#(Html.JQueryUI().Datepicker("anotherDate").MinDate(DateTime.Today).ShowButtonPanel(true)
.ChangeYear(true).ChangeMonth(true).NumberOfMonths(2))
</div>
May be it is because you have called jquery after the validate js and an error occurred and script stopped functioning. Check your error console and include jquery-1.7.1.min.js before all other jquery plugin js and try again. I didnt find any error in the datepicker initialisation function.
I believe it is because when you run Install-Package jQueryUIHelpers.Mvc3 the current version installs ~/Scripts/jquery-ui-1.8.19.min.js and ~/Scripts/jquery-1.7.2.min.js. However, the demo code references version ~/Scripts/jquery-ui-1.8.18.min.js and ~/Scripts/jquery-1.7.1.min.js which is the version you have used. Unless you have manually installed this file, you will not be referencing the correct version.
I am working with ASP.NET MVC 3 (Razor)
I loaded a partial view by holds a form by clicking on Ajax Link that is located on my view as follows
#Ajax.ActionLink("Students List", "Create", "Student", new AjaxOptions {OnSuccess = "updatePlaceholder", UpdateTargetId = "holder" })
The partial view loads properly, but I discovered that the Telerek DatePicker isn't showing when I click on the button to bring it down
and also client side validations arent working also. I followed the approch described here but it still insn't working
http://www.telerik.com/help/aspnet-mvc/using-with-partial-views-loaded-via-ajax.html
My code is below
HERE IS MY VIEW
#Ajax.ActionLink("Students List", "Create", "Student", new AjaxOptions {OnSuccess = "updatePlaceholder", UpdateTargetId = "holder" })
function updatePlaceholder(context) {
// the HTML output of the partial view
var html = context.get_data();
// the DOM element representing the placeholder
var placeholder = context.get_updateTarget();
// use jQuery to update the placeholder. It will execute any JavaScript statements
$(placeholder).html(html);
// return false to prevent the automatic update of the placeholder
return false;
}
HERE IS MY PARTIALVIEW
#model MyUniversity.Models.Student
#using (Ajax.BeginForm(new AjaxOptions {UpdateTargetId="holder"}))
{
#Html.ValidationSummary(true)
Student
#Html.Telerik().DateTimePicker().Name("EnrollmentDate").Value(DateTime.Now.ToString())
#Html.ValidationMessageFor(model => model.EnrollmentDate)
<p>
<input type="submit" value="Create" />
</p>
</fieldset>
}
#Html.ActionLink("Back to List", "Index")
Here is my _Layout.cshtml with the registered scripts
#ViewBag.Title
<script src="#Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<link href="#Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<script src="#Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/MicrosoftAjax.debug.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/MicrosoftMvcAjax.debug.js")" type="text/javascript"></script>
#(Html.Telerik().StyleSheetRegistrar().DefaultGroup(group => group.Add("telerik.common.css").Add("telerik.telerik.css").Combined(true).Compress(true)))
<script src="#Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>
#(Html.Telerik().ScriptRegistrar().Globalization(true).DefaultGroup(group => group.Combined(true).Compress(true)))
I have partial view that is loaded without Ajax. I had trouble making both the validation and Telerik datepicker popup to work. On my partial view I added the three scripts for validation:
<script src="#Url.Content("~/Scripts/jquery-1.5.1.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>
But with this the popup wouldnt work, so I added these scripts to my _layout.cshtml just before:
#Html.Telerik().ScriptRegistrar()
I had already registered the following scripts on the _layout.cshtml page on the top:
<script src="#Url.Content("~/Scripts/MicrosoftAjaxTemplates.debug.js")" type="text/javascript"></script>
<script src="../../Scripts/MicrosoftMvcAjax.js" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/ui/jquery.ui.core.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/ui/jquery.ui.widget.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery.ui.datepicker.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery.ui.tabs.js")" type="text/javascript"></script>
<!-- Telerik Extensions for MVC Scripts -->
<script src="#Url.Content("~/Scripts/2011.2.712/telerik.combobox.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/2011.2.712/telerik.grid.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/2011.2.712/telerik.grid.editing.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/2011.2.712/telerik.grid.filtering.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/2011.2.712/telerik.grid.grouping.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/2011.2.712/telerik.grid.reordering.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/2011.2.712/telerik.grid.resizing.min.js")" type="text/javascript"></script>
<script src="../../Scripts/2011.2.712/telerik.datetimepicker.min.js" type="text/javascript"></script>
<script src="../../Scripts/2011.2.712/telerik.datepicker.min.js" type="text/javascript"></script>
<script src="../../Scripts/jquery-1.2.6.min.js" type="text/javascript"></script>
After that all seems to work fine.