Press the button in an HTML document to activate JavaScript

What could be the issue with my code? I have a button in HTML

<a class="btn btn-warning btn-mini publish-btn" href="#" data-rowid="@computer.id" data-toggle="modal" data-target="#myModal">Outdated</a>

and my modal

<fieldset style="text-align:center;vertical-align:middle;">
<input type="radio" name="options" id="option1" />  : Publish Now<br/>
<input type="radio" name="options" id="option2" />  : Schedule Publish<br/>
</fieldset>
<div class="modal-footer">
<button type="button" class="btn btn-default" id="submitBtnPublishId"  >OK</button>
<button type="button" class="btn btn-primary" data-dismiss="modal" id="submitBtnSpublishId"  >Cancel</button>

and my JavaScript

$(function(){
 $/-("a.publish-btn").click(function(e) {
 var obj = $(this);
 e.preventDefault();
 $('#submitBtnPublishId').click(clickOnPublish);
 function clickOnPublish()
 {}})})

The functionality is not working when clicking the OK button. Why is that happening?

javascriptjqueryhtmlcsstwitter-bootstrap

Answer №1

You have incorrectly used the $ sign. Please correct it as shown below:

$(function(){
 $("publish-btn").click(function(e) {
 var obj = $(this);
 e.preventDefault();
 $('#submitBtnPublishId').click(clickOnPublish);
 function clickOnPublish()
 {}})})

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

Utilizing JavaScript for validation on an ASPX page within Visual Studio

After entering an email ID in a textbox, the email validation process is initiated. However, it seems that there is an issue where the entire function may not be executed properly. <head runat="server"> <title></title> ...

javascriptasp.netvisual-studio

Implementing styling upon app mounting in Vue.js - a step-by-step guide

Hey, I'm working with a template code that looks like this: Here's my script code: data () { return { loadPage: true } }, mounted () { this.loadPage = true }, And here is my styling code: #app{ width: 100%; opacit ...

javascriptvue.js

How can we eliminate identical elements from an array in JavaScript and increment the count of other objects?

I currently have 1 object retrieved from local storage, but it seems to contain some duplicates. What is the easiest way to remove these duplicates? The array object I am working with is called "mainchart". function check() { for (let i = 0; i < main ...

javascriptarrays

Selecting a specific section from a JSON data reception

Upon executing a POST request to , the resulting response typically looks like this: { "success": true, "data": { "url": "http://i.imgflip.com/1nciey.jpg", "page_url": "https://imgflip.com/i/1nciey" } } Is there a way for me to output the s ...

javascriptjson

Dynamic navigation menu shifting when bolded

Looking at my menu, you'll notice the following layout: If one clicks on Recruitment in the menu, it correctly bolds the text as intended. However, an issue arises where the entire menu unexpectedly shifts 1 or 2px to the left. The menu is implemente ...

xhtmlmenudotnetnukecss

The CSS attribute selector is unable to target dynamically appended class names

Utilizing React's CSS animations add-on has been a seamless process, with everything running smoothly when using the provided classnames. .quote-enter { opacity: 0.01; transition: opacity .25s ease-in; } .quote-enter.quote-enter-active { opaci ...

csscss-selectors

Ensure that the navigation highlight remains on the current page

I am facing an issue with my website navigation. I have implemented a jQuery animation where a green slider comes down when hovering over the < li > tag. The problem arises when the current page is highlighted and the slider reverts back to the top ...

jqueryhoverhighlight

Encountering 'Illegal Invocation' error while running a basic script

Exploring the Speech Recognition API has been on my to-do list, so I decided to create a simple page that initiates recognition when clicking on the body element. Here is a snippet from my scripts.js file: var recognition = new window.webkitSpeechRecognit ...

javascript

Collaborating and monitoring data between controllers

A unique challenge has arisen as we implement a tree-style navigation element that must communicate with other directives/controllers. The main objectives are: Keep track of the current selection, Detect when the row selection changes. The task at hand ...

javascriptangularjs

When using res.json(), the data is returned as res.data. However, trying to access the _id property within it will result

I'm facing a challenge in comprehending why when I make a res.json call in my application, it successfully sends data (an order object). However, when I attempt to access and assign a specific piece of that data (res.data._id) into a variable, it retu ...

javascriptreactjsexpressaxios

Create a class for the grandparent element

Is there a way to dynamically add a class to a dropdown menu item when a specific child element is clicked? Here's the HTML structure I have: <ul id="FirstLevel"> <li><a href="#">FirstLevel</a></li> <li>< ...

javascriptjqueryhtmlcssdrop-down-menu

jQuery fails to recognize the pressing of the "left" key within an input field

Here is my code: $('input').live('keypress', function(event) { if (event.keyCode === 37) console.log("left key pressed"); else console.log("some other key press"); }); For a live demo, please visit http://jsfiddle.net/4RKeV/ A ...

jquery

If the width of the window is below 768px, do not execute the function

In order to prevent the showCover() function from firing when the window width is less than 768px on page load AND resize, I have made some adjustments to the code below. Even though the window is smaller than 768px, the function will not be triggered. ...

javascriptjqueryjquery-hoverwindow-resize

Ways to adjust image placement and size post-rotation with CSS/JS to ensure it stays within the containing div and avoids being cut off

Check out this jsfiddle I've been experimenting with. The jsfiddle is designed to rotate an image by 90 degrees in either clockwise or anti-clockwise direction upon button click. However, the rotated image currently appears outside of its parent div. ...

htmlcssangularjsrotation

Access a specific element within an array using Handlebars.js

After converting a CSV to JSON, I have data that looks like this: [["Year","Make","Model","Description","Price"],["1997","Ford","E350","ac, abs, moon","3000.00"],["1999","Chevy","Venture \"Extended Edition\"","","4900.00"],["1999","Chevy","Ventu ...

javascriptjsonhandlebars.js

Ways to reduce the amount of time spent watching anime when it is not in view

My anime experiences glitches as the black container crosses the red, causing a decrease in duration. Is there a way to fix this glitch? I attempted to delay the changes until the red path is completed, but the glitches persist. delayInAnimeSub = ourVilla ...

javascripthtmlcssanimation

Angular Universal functioning fine on local host, yet encountering issues on Nginx Server

I recently developed a project with Angular Universal. After building the project, it generated files such as browser, server, server.js, and prerender.js. I am curious to learn how I can run this project on an nginx server. Currently, I create a build o ...

javascriptangularnginxuniversal

Is there a way to determine the distance in miles and feet between various sets of latitude and longitude coordinates?

I am working with an array of latitude and longitude coordinates and I am looking to use JavaScript or Typescript to calculate the distance in miles and feet between these points. const latsLngs = [ { lat: 40.78340415946297, lng: -73.971427388 ...

javascriptangulartypescript

Handling scroll events in a functional component using React

I'm having trouble understanding why the onScroll function isn't triggering the console.log statement. <table className="table" onScroll={()=>{console.log("Works")}> The console.log just doesn't seem to be exec ...

javascriptreactjsonscroll

The color of the Angular md-switch .md-thumb is not showing up properly when switching the toggle

In Safari, the md-switch displays a yellow section on the md-thumb when toggled. However, other browsers handle the switch without any issues. The md-bar appears fine, but the md-thumb is yellow. I have tried setting everything to the blue color I am using ...

htmlcssangularjssafariless