Selection List dictates the necessity of JavaScript

I need to create a JavaScript code that will require the comment field (textarea) when a selection is made from a list. Currently, I have added a required icon next to the comment section but I am stuck at this point. See the code below.

Thank you in advance for any assistance

Here is the code I have written:

<select id="ddlViewBy">
<option value="1">AJS.$("#comment-popup").parent().children('label').append('<span class="aui-icon icon-required"></span>');</option>

Source Code of my Website :

<form action="/jira/rest/tempo-rest/1.0/worklogs/{issueKey}" class="aui tempo-form" data-form-type="" name="tempo-panel-form-popup" method="post">
<div class="form-body" style="max-height: 393px;">
    <input type="hidden" name="id" value="">
    <input type="hidden" name="type" value="issue">
    <input type="hidden" name="use-ISO8061-week-numbers" value="false">
    <input type="hidden" name="ansidate" value="">
    <input type="hidden" name="ansienddate" value="">
    <input type="hidden" name="selected-panel" value="">
    <input type="hidden" name="analytics-origin-page" value="">
    <input type="hidden" name="analytics-origin-view" value="">
    <input type="hidden" name="analytics-origin-action" value="">

    <!-- Rest of the source code goes here -->

</div>
javascript

Answer №1

It seems like you are working within the Atlassian product suite.

To make an HTML field mandatory, you can add the required attribute which works in all modern browsers except for Safari. Please verify this.

The JavaScript (jQuery) code to add an attribute would be:

 $('#comment-popup').attr('required', 'required');

If it is an AUI-select or AUI input, refer to the documentation at . In a select element, for example, there is a non-empty attribute available.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Incorporate a Vue.js computed property into the data retrieved from a server

Coming from Knockout.js, where observables are easily created by defining them, I'm curious if there's a similar approach in Vue.js. let vm = { someOtherVar: ko.observable(7), entries: ko.observableArray() }; function addServerDataToEnt ...

javascriptvue.jsknockout.jsvuejs2async-await

Ending an $.ajax request when the page is exited

Currently, I have a function set on a timer to retrieve data in the background: (function fetchSubPage() { setTimeout(function() { if (count++ < pagelist.length) { loadSubPage(pagelist[count]); fetchSubPage(); ...

javascriptjquery

Exploring the issue of $scope variable changes not reflecting in ng-show elements in AngularJS

I am in the process of creating a website that includes a video element. For those interested, here is a link to the code for my page on Plunker: http://plnkr.co/edit/5NUnZ2KET1apWwxMxjex?p=preview The video on the website utilizes the html5 video tag, a ...

javascriptangularjsvideo

Uninterrupted jQuery AJAX calls

I have a scenario where I need to periodically update an image on my view using ajax every 10 seconds. Any suggestions on how I can achieve this? Appreciate the help. ...

phpjavascriptjqueryhtml

Clicking will cause my background content to blur

Is there a way to implement a menu button that, when clicked, reveals a menu with blurred content in the background? And when clicked again, the content returns to normal? Here's the current HTML structure: <div class="menu"> <div class=" ...

javascriptjqueryhtmlcss

When initially loaded, the Bootstrap Datepicker displays an inaccurate calendar

I implemented Bootstrap Datepicker to insert a date input field into my HTML document. Below is the code I used: HTML: <input type="text" name="manifest-date" class="calendar form-control" placeholder="M-d-yy" id="manifest-date" value="{{$currentDate} ...

javascripthtmltwitter-bootstrap

Add a variety of parameters to the URL in order to make an AJAX request

I want to dynamically add values from checked checkboxes to a URL for use in an AJAX call. I only want these values to be added to the URL if the checkbox is checked. If a user checks and then unchecks, I do not want that value included in the URL. Below ...

javascriptjqueryajax

"From time to time, reimport React when saving to ensure all necessary imports are

When working with TypeScript in *.tsx files, particularly when copying code around, I frequently encounter the issue of an additional import line being added. This can be seen below: import React from "react"; // ? On Save "editor ...

javascriptreactjstypescriptvisual-studio-code

Updates to the AngularJS model are not appearing in the user interface

Despite executing the controller code, the values in the UI remain unchanged. The initial values are displayed without any issue. I've attempted to call $scope.$apply() at the end of each function (submit and transfer), but it didn't resolve the ...

javascriptangularjs

How can I show a title when redirecting a URL in VUE JS?

My current setup includes a navigation drawer component that changes the title based on the user's route. For example, when navigating to the home page (e.g. "/"), the title updates to "Home", and when navigating to the profile page (e.g. /profile), t ...

javascriptvue.jsvuejs2

Error encountered: Unexpected token '"', expecting "}". Perspective from React : It is an unfortunate occurrence which h

I'm a newbie when it comes to React and I'm currently following a tutorial. Unfortunately, I encountered an error message while the script was trying to compile: Parsing error: Unexpected token, expected "}" The issue seems to be with the &apos ...

javascriptreactjsfrontend

Utilize regular expressions to substitute content with HTML tags within a directive

While working with Angular JS to iterate through Twitter tweets using ng-repeat, I encountered the need to highlight certain parts of the tweet string such as @tag and #hash. To achieve this, it was suggested to utilize replace method to wrap these element ...

javascripthtmlangularjsregex

Retrieve a JavaScript file located in a separate folder

I'm facing an issue with a project that has the following layout: project | - public | - -index.html src | - -index.js The code I am using to import the file is as follows: <script src="../src/index.js"></script> H ...

javascript

developing a cheat prevention system for an internet-based multiplayer game

I am facing an issue with my website that includes a simple game and a basic scoreboard feature using express. Whenever a player dies in the game, their score is sent to the server via a post request and added to the leaderboard. The problem I'm encou ...

javascriptnode.jsexpresssecurity

The then() function in Node.js is triggered before the promise is fully resolved

I'm struggling to get my Promise function working as intended. Here's what I need to accomplish: I am receiving file names from stdout, splitting them into lines, and then copying them. Once the copy operation is complete, I want to initiate oth ...

javascriptnode.jspromise

Navigating a collection of objects after a button is clicked

My current library project involves looping through an array of objects to display them on a grid based on input values. Here is the code snippet for my loop: const addBook = (ev) => { ev.preventDefault(); let myLibrary = []; let bookIn ...

javascripthtmlcss

POST request in Ajax with NodeJs/MongoDB/Mongoose causing an Uncaught TypeError: Illegal invocation

Whenever I attempt to make a POST request using Ajax/Jquery, I keep encountering an error in the console. The specific errors are on lines 67 and 31 in the createTeam.js file: $.ajax({ //line 67 sendInvitation(teamID,_companyName,teamName) //lin ...

javascriptjqueryajaxnode.jsmongodb

JavaScript for Dynamic Scaling Animations

I am currently working on animating an SVG button and I am trying to incorporate the transform property with a fadeout using opacity attributes in Javascript. This is how I have attempted to write the code: (Starting with opacity 0 and scale 0) (I am awa ...

javascriptcssattributestransform

Do Material-UI pickers only validate on blur, not on change events?

When you type inside the DatePicker component, validation is triggered immediately. Is there a way to trigger validation on blur instead of onChange when using @material-ui/pickers with material-ui v4 Passing the value to the blur function should work a ...

javascriptreactjsdatepickermaterial-uionblur

Tips for detecting and handling errors in user input from the console

Is there a way to catch errors in Chrome's developer tools console when an input throws an error? I attempted using window.addEventListener("error") but it seems that the onerror event listener on window does not capture the console errors. ...

javascript