Leveraging JavaScript to attach/append a query parameter to a URL

Question

Leveraging JavaScript to attach/append a query parameter to a URL

Currently, I am working with the DNN CMS platform and utilizing a module called ActionForm provided by DNNSharp to generate forms.

Although there is an option in this module to display a form in a popup, I am facing a challenge in passing a query string to the popup URL using this method.

The HTML code snippet related to this issue looks like this:

<a href="javascript: showFormPopup1163();">Link Title</a>

Whenever I try to add ?mystring=[mytoken] at the end of the href attribute, it causes the link to stop functioning.

After some research, I have come across information suggesting that adding the query string to the popup URL can be achieved using JavaScript.

I came across this topic on Stack Overflow but I am uncertain whether it provides a solution applicable to my situation and how to actually implement it:

Add Query-String parameter to static link on click

Would inserting that particular code into script tags within my HTML code resolve my query string dilemma?

Any assistance or insights on this matter would be greatly appreciated.

Many Thanks, Alex

javascript asp.net dotnetnuke-module dotnetnuke-7

Answer 1

Answer №1

I achieve this by utilizing History.js

It is uncertain if ActionForms includes a feature that enables the inclusion of external scripts, but assuming you can integrate history.js, you can implement something similar to the following:

var queryStringParams = '?mystring=[mytoken]';
var dataObj = '{ mystring: [mytoken] }';
var titleText = 'Form with token: [mytoken]';
History.pushState(dataObj, titleText, queryStringParams);

This action will modify the URL without re-loading the page and will also permit users to navigate back to the previous URL using the browser's back button, all while maintaining the original query string.

Answer 2

I achieve this by utilizing History.js

It is uncertain if ActionForms includes a feature that enables the inclusion of external scripts, but assuming you can integrate history.js, you can implement something similar to the following:

var queryStringParams = '?mystring=[mytoken]';
var dataObj = '{ mystring: [mytoken] }';
var titleText = 'Form with token: [mytoken]';
History.pushState(dataObj, titleText, queryStringParams);

This action will modify the URL without re-loading the page and will also permit users to navigate back to the previous URL using the browser's back button, all while maintaining the original query string.

Leveraging JavaScript to attach/append a query parameter to a URL

Answer №1

Similar questions

JavaScript does not allow for the incrementation of a global variable within a function

Automatically injecting dependencies in Aurelia using Typescript

React's useState feature is doubling the increment

Is there a way to determine the duration that a click was held down for?

Styling Bootstrap radio toggle buttons using CSS

Experiencing a Number TypeError Issue with Mongoose Schema?

Development of Chrome Extensions, JavaScript dilemma

I am receiving an error stating "Page not found" when making an AJAX request. What could be causing

When the `back` button is clicked in a browser from a different domain, does it trigger a page reload?

JQuery post will not be able to retrieve from Asp.Net SQL Session Mode

Converting an ASP.NET web form into a serialized format

Verify whether the division contains any elements and does not include specific elements

Send nodejs express static request over to secure https server

Google Maps API displaying empty spots instead of markers

Executing several conditional calls in RxJS

Interactive Image Modal with Zoom In/Out feature

Is there a way to prevent ng-template-loader from scanning image src's?

Show JSON array items

Can the variables in Bootstrap be altered dynamically during runtime?

Perform the function with the value of the currently selected option