Guide to creating AngularJS directive attributes without a right-hand side in hiccup code?

I'm currently developing an AngularJS application using markup in hiccup format. Here is a snippet of the markup:

<div modal-show modal-visible="showDialog" .........></div>

Below is the corresponding Hiccup I have created:

[:div.modal.fade
  {  :modal-show 
     :modal-visible "showDialog"
     :aria-hidden "true",
     :aria-labelledby "terms-n-services-modal-label",
     :role "dialog",
     :tabindex "-1"}
    [:div.modal-dialog
     [:div.modal-content
      [:div.modal-header
       [:button.close
        {:aria-hidden "true", :data-dismiss "modal", :type "button"}
        "×"]
       [:h4#terms-n-services-modal-label.modal-title "Terms & Services "]]
      [:div.modal-body ""]
      [:div.modal-footer
       [:button.btn.btn-default
        {:data-dismiss "modal", :type "button"}
        "Close"]]]]]

However, I encountered an error while attempting to run my code:

java.lang.RuntimeException: Map literal must contain an even number of forms, compiling

I understand that the map literal cannot handle :modal-show without its corresponding value/right-hand side to form a key-value pair.

What would be the best approach to resolve this issue? Should I simply assign an empty string or null as the value?

Answer №1

In my opinion, the optimal solution would be to assign it a value of an empty string. This way, the outcome will appear as modal-show="", but from what I understand, it should be interpreted in the same manner as simply modal-show. If you desire Hiccup to display only modal-show, it may be necessary to delve into the source code and integrate this functionality.

Additionally, give this link a look: Are empty HTML5 data attributes considered valid?

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

Express npm dependency fails to start globally

I have recently reinstalled my operating system from Windows 8.1 to Windows 8.1, and I have been using npm for quite some time. Previously, it was working fine as mentioned here. After the reinstallation, I tried installing npm i -g express, but it does n ...

My server keeps crashing due to an Express.js API call

I'm completely new to express.js and API calls, and I'm stuck trying to figure out why my server keeps crashing. It works fine the first time, rendering the page successfully, but then crashes with the error: TypeError: Cannot read property &apo ...

The consequences of jQuery Ajax Memory Leaks

After reading through several other posts on the topic, I have noticed a memory leak issue when making repeated ajax calls with jQuery (every 30 seconds in my case). Switching from using $get to $post helped reduce the size of the leak, but it still occurs ...

Encountering difficulties in constructing next.js version 14.1.0

When attempting to build my next.js application, I use the command npm run build Upon running this command, I encountered several errorshttps://i.sstatic.net/5jezCKHO.png Do I need to address each warning individually or is there a way to bypass them? B ...

Implementing XOR operation in a jQuery script

In need of a small script modification where one value needs to be XORed. A previous suggestion no longer applies due to changes made in the script. <input type='button' value='Ein / Aus' class='taster' csv='Lampe&apo ...

Ways to retrieve response data from the server using angularjs

In my current setup, I have a Node.js server handling the authentication process while AngularJS is used on the frontend. When a user clicks a button to sign in with Facebook, the server takes care of all authentication aspects and redirects to the URI of ...

Create a customizable table without relying on external jQuery plugins

Looking to develop a table with editable content (using an "edit" button on each row) without relying on Bootstrap or any additional plugins. The goal is to utilize HTML, PHP, AJAX, and JavaScript exclusively for this task. Can anyone provide guidance, sam ...

Locate all nodes in neo4j that are connected to nodes matching a specified list of property values of a certain length

To clarify, I am interested in achieving the following (preferably using node/JS): Imagine you have a set of 3 job requirements ('JavaScript', 'PHP', 'MySQL'). In my graph setup, each Person node can be linked to multiple Sk ...

Unable to send post parameters to Yii2 controller using an XHR request

Within the context of my project, I am making an xhr request to a yii2 controller. Here is how the request is structured in my view: var xhr = new XMLHttpRequest(); xhr.open('POST', '$urlToController', true); xhr.setRequestHeader("Co ...

What is the minimum required browser version supported (Chrome, IE, Mozilla)?

I need to determine the minimum browser version required of Chrome, IE, and Mozilla for each item listed below: -------------item-------------Chrome----------------IE-------------------Mozilla bootstrap.js(v3.0.0)----------??????----------------??------- ...

Include a new row in the form that contains textareas using PHP

I'm trying to add a new row to my form, but I'm facing challenges. When I click the add button, nothing happens. If I change the tag to , then I am able to add a row, but it looks messy and doesn't seem correct to me. Here is my JavaScript ...

What is the best way to guide a user to a specific page based on the choice they made after submitting a form?

My form includes a list of 6 options where users can only select one. After submitting the form, I want to redirect them to a specific page based on their selection. For example, I have the following 3 options: Facebook Youtube Twitter If a user selects ...

"Utilizing jQuery and AJAX to manage identical-named option boxes with

I am encountering an issue with multiple select boxes that share the same name. Currently, when I choose a value from one select box, it submits that selection and updates the database. However, when I select an item from another select box, it still submi ...

Tips for halting the movement of marquee text once it reaches the center briefly before resuming animation

Is there a way to make text slide in, pause when centered, and then repeat the process? I'm looking for some help with this animation. Here is the code snippet: <marquee direction="left" id="artistslide"> <span id="currentartist">< ...

Guidelines for attaching a div to the bottom of a page?

I have a navigation menu inside div.wrapper, and I am trying to make the div.wrapper stick to the footer. <div class="wrapper"> <div id="menu"> <ul> <li>1.</li> <li>2.</li> ...

Triggering an event upon selecting a dropdown option

I'm currently working on a form that includes a dropdown menu. My goal is to display specific keywords for each trip when selected from the menu (preferably below the input field, as shown in the code snippet below). .show has been set to display:non ...

Understanding the relationship between controller and view in AngularJS is crucial for building dynamic

My AngularJS script with MVC architecture is causing some issues. I suspect that there might be errors in the connection between the model, view, and controller layers. JS: var myApp = angular.module("myApp", []); //App.js myApp.controller('MainCon ...

Error message due to an undefined function in Angular datatables Fixed Columns

I recently implemented angular datatables with fixed column in my application. Here is the HTML code I used for the view: <div class="row" ng-controller="PerformanceCtrl"> <table id="example" datatable="" class="stripe row-border or ...

What could be causing the lack of change in a dynamic input value in Angularjs?

There is an input with ng-model="articleTitle" and a div with {{articleTitle. When the input is typed in, the div is updated. However, there is a box that lists all articles enclosed by <div class="element">...</div>. When a list div is clicke ...

Ways to iterate through a JSON formatted array variable using JavaScript

Below is my code snippet, used to plot all the locations fetched from my database onto a Google map. $.ajax({ url:"http://localhost/church_finder/index.php/MapController/search_church", type:'POST', data: ...