I have a strange issue. I am currently using the latest version of ASPNETZERO JQuery version. I am attempting to get SurveyJS to run properly. My issue is I am unable to get it to render and I believe it has something to do with JQuery. Attached is my view code
@using Service.Authorization @using Service.Web.Areas.App.Startup @{ ViewBag.CurrentPageName = AppPageNames.Common.FormQuestionaire; } @section Scripts { <script src="https://surveyjs.azureedge.net/1.7.4/survey.jquery.js"></script> <script src="https://surveyjs.azureedge.net/1.7.4/surveyjs-widgets.js"></script> <script src="https://surveyjs.azureedge.net/1.7.4/surveyjs-widgets.js"></script> <script abp-src="/view-resources/Areas/App/Views/FormQuestionaire/Index.js"></script> } @section Styles { <link href="https://surveyjs.azureedge.net/1.7.4/modern.css" type="text/css" rel="stylesheet" /> @<link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/themes/smoothness/jquery-ui.css" type="text/css" rel="stylesheet" />@ }
<link href="https://surveyjs.azureedge.net/1.7.4/modern.css" type="text/css" rel="stylesheet" />
<script> //(function ($) { //jQuery($ => { $(document).ready(function () { alert("Inside Jquery");
Survey
.StylesManager
.applyTheme("modern");
var json = {
};
window.survey = new Survey.Model(json);
survey
.onComplete
.add(function (result) {
document
.querySelector('#surveyResult')
.textContent = "Result JSON:\n" + JSON.stringify(result.data, null, 3);
});
survey.render("surveyElement");
});
//});
</script> <div class="kt-content kt-grid__item kt-grid__item--fluid kt-grid kt-grid--hor"> <div class="kt-subheader kt-grid__item"> <div class="@(await GetContainerClass())"> <div class="kt-subheader__main"> <h3 class="kt-subheader__title"> <span>@L("FormQuestionaire")</span> </h3> <span class="kt-subheader__separator kt-subheader__separator--v"></span> <span class="kt-subheader__desc"> @L("FormFieldsQuestionaireHeaderInfo") </span> </div> <div class="kt-subheader__toolbar"> <div class="kt-subheader__wrapper">
</div>
</div>
</div>
</div>
<div class="@(await GetContainerClass()) kt-grid__item kt-grid__item--fluid">
<div class="kt-portlet kt-portlet--mobile">
<div class="kt-portlet__body">
<div id="surveyElement"></div>
<div id="result"></div>
</div>
</div>
</div>
</div>
From this you can see I am referencing the JS files in the @section Scripts. When I run the code in the browser I am getting the error $ is not defined. I have attempting to define in my scripts section (function ($) jQuery($ => {});); with no luck. How can I ensure JQuery is references properly?
8 Answer(s)
-
0
Hi @rrader26
JQuery must be included by default to your page. Could you share the location of your cshtml file ? Is it under "Areas/AppAreaName/Views/**" ?
Thanks,
-
0
the files are under Areas/App/Views/FormQuestionaire.
I have tried to add JQuery to my page but than I get other errors that pop up. So I assumed it was added by default somewhere within the project.
What is the proper way to add JQuery?
-
0
Hi,
Sorry, I couldn't read your first post correctly. You need to put below script into Scripts section;
@section Scripts { $(document).ready(function () { alert("Inside Jquery"); // other code blocks }); } -
0
I have tried that before and it did not work either. Seems odd to me. I would get $ is not defined
-
0
Hi @rrader26
Is it possible to share your project via email with [email protected] ? We can find the problem faster in that way.
-
0
I sent an email with a link to the source code
-
0
Moving custom scripts into @section Scripts fixes the problem.
-
0
I got SurveyJS to work in mine - same (Core / Jquery) -
However - it's dependencies have a LOT of vulnerabilities.
I don't know if that's a big problem, but it sort of scared me away from it.
