У меня проблемы с интеграцией JavaScript в ASP. NET. Я хочу использовать jQuery или даже Vanilla JavaScript для выполнения некоторых операций на стороне клиента, но я не могу получить доступ к HTML и ASP. NET элементам управления сервером. Я перепробовал много решений, как и <%= element.ClientID %>
, но ни одно из них не помогло мне Я не могу определить свою ошибку, пожалуйста, помогите мне определить.
Alread Tried :
RegisterClientScriptBlock
- Включить JavaScript Файл напрямую
$("#<% element.ClientID %>")
document.getElementById("<%= element.ClientID %>")
; - Использование управления HTML вместо сервера и наоборот.
new_quiz. aspx
<%@ Page Title="" Language="C#" MasterPageFile="~/teacher_quizes/teacher_quizes.master" AutoEventWireup="true" CodeBehind="new_quiz.aspx.cs" Inherits="onlineQuiz_bsef17m35.teacher_quizes.new_quiz" %>
<asp:Content ID="Content1" ContentPlaceHolderID="quizes" runat="server">
<div class="form p-2">
<div class="form-group p-1">
<asp:Label runat="server" Text="Quiz Title"></asp:Label><br />
<small class="text-danger">The title of your quiz</small>
<input runat="server" type="text" maxlength="64" id="title"
class="form-control"/>
<asp:RequiredFieldValidator runat="server" ControlToValidate="title"
ErrorMessage="Title is required"></asp:RequiredFieldValidator>
</div>
<div class="form-group p-1">
<asp:Label runat="server" Text="Quiz Description"></asp:Label><br />
<small class="text-danger">Please describe this quiz</small>
<textarea runat="server" id="description" class="form-control" rows="2"
maxlength="128">
</textarea>
<asp:RequiredFieldValidator runat="server" ControlToValidate="description"
ErrorMessage="Description is required" CssClass="text-warning text-muted">
</asp:RequiredFieldValidator>
</div>
<div class="form-group p-1">
<asp:Label runat="server" Text="Maximum Marks"></asp:Label><br />
<small class="text-danger">The maximum achiveable marks for this quiz, between 1 and 1000</small>
<input runat="server" type="number" min="1" max="100" id="maxMarks"
class="form-control"/>
<asp:RangeValidator MinimumValue="1" MaximumValue="1000"
runat="server" ControlToValidate="maxMarks" CssClass="text-warning"
ErrorMessage="Please choose a number between 1 and 100">
</asp:RangeValidator>
</div>
<div class="form-group p-1">
<asp:Label runat="server" Text="Passing Marks"></asp:Label><br />
<small class="text-danger">The passing marks for this quiz, between 1 and 1000 and lesser than or equal to total marks</small>
<input runat="server" type="number" min="1" max="100" id="passingMarks"
class="form-control"/>
<asp:RangeValidator MinimumValue="1" MaximumValue="1000"
runat="server" ControlToValidate="passingMarks" CssClass="text-warning"
ErrorMessage="Please choose a number between 1 and 100">
</asp:RangeValidator>
</div>
<div class="form-group p-1 card mb-2">
<div><b runat="server" id="questions">Quesions</b></div>
<div class="form-group">
<asp:Label runat="server" Text="Question"></asp:Label><br />
<asp:TextBox runat="server" ID="question" CssClass="form-control"/>
<asp:Label runat="server" Text="Type of Question"></asp:Label><br />
<select runat="server" id="questionType" class="form-control"
onchange="questionTypeChange()"></select>
<div runat="server" id="questionOptions">
<small>Please check checkbox in front of Options to denote an option as true</small>
<div class="form-group">
<asp:Label runat="server" Text="Option 1"></asp:Label><br />
<input runat="server" type="text" maxlength="64" id="questionOption1"
class="form-control" />
<input runat="server" type="checkbox" id="questionOption1Validity"
class="input-group-append"/>
<asp:RequiredFieldValidator runat="server" ControlToValidate="questionOption1"
ErrorMessage="Option 1 is required!" CssClass="text-danger">
</asp:RequiredFieldValidator>
</div>
<div class="form-group">
<asp:Label runat="server" Text="Option 1"></asp:Label><br />
<input runat="server" type="text" maxlength="64" id="questionOption2"
class="form-control" />
<input runat="server" type="checkbox" id="questionOption2Validity"
class="input-group-append"/>
<asp:RequiredFieldValidator runat="server" ControlToValidate="questionOption2"
ErrorMessage="Option 2 is required!" CssClass="text-danger">
</asp:RequiredFieldValidator>
</div>
<div class="d-flex flex-row-reverse">
<button class="btn btn-sm btn-primary">Add another Option</button>
</div>
</div>
</div>
</div>
</div>
</asp:Content>
new_quiz.aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.IO;
namespace onlineQuiz_bsef17m35.teacher_quizes
{
public partial class new_quiz : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (IsPostBack)
{
return;
}
DatabaseEntities db = new DatabaseEntities();
var quizes = db.getQuestionTypes().ToArray();
questionType.DataSource = quizes;
questionType.DataBind();
if (questionType.Value == "Multiple Choice")
{
questionOptions.Visible = true;
} else
{
questionOptions.Visible = false;
}
/* register client scripts */
Type scriptType = this.GetType();
String scriptName = "script";
String scriptUrl = "./new_quiz.js";
String scriptText = File.ReadAllText(Server.MapPath(scriptUrl));
ClientScriptManager scriptManager = Page.ClientScript;
if (!scriptManager.IsClientScriptBlockRegistered(scriptType, scriptName))
{
scriptManager.RegisterClientScriptBlock(scriptType, scriptName, scriptText, true);
}
}
}
}
new_quiz. js
function questionTypeChange() {
const element = document.getElementById("<%= question.ClientID %>");
console.log(element);
}