I am looking to include query string variables within JSON key-value pairs

On my webpage, I have a .asp page using the following url: 

page.asp?id=33&album=ourcookout
The page.asp file then calls a file.js script. Within the file.js script, there is a line located under a function that reads as follows: url: "post_file.php", My question is, how can I include the id=33 and album=cookout parameters at the end of the JSON key/value pairs?

The expected outcome should be url: 

post_file.php?id=33&album=cookout
. However, keep in mind that the id number and album name may vary.

I am curious about how the .js file dynamically appends these variables to the specified key within the JSON object. Can anyone provide some insight on this process?

javascriptasp.netjsonkeyvaluepair

Answer №1

To enhance the functionality of your ASP file, incorporate hidden fields within it;

<input type="hidden" id='myID' value="<%= Request("id") %>" />
<input type="hidden" id='myAlbum' value="<%= Request("album") %>" />

Ensure that these hidden fields are displayed on the webpage prior to executing any Javascript.

Next, insert the following snippet into your Javascript file just before preparing the JSON data;

var myID = document.getElementById("myID").value;
var myAlbum = document.getElementById("myAlbum").value;

Subsequently, update the JSON preparation as follows;

url: "post_file.php?id=" + myID + "&album=" + myAlbum

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

How can I implement Jquery validation engine ajax for two different fields using the same function?

The jQuery validation engine plugin has a unique feature of performing ajax validation. However, there is a minor inconvenience with this functionality. Instead of validating the field name, it sends the field ID for validation. Why does this pose a prob ...

javascriptjqueryajaxjquery-validation-engine

Updating Sailsjs Localization Settings

After working with Sails.js for a while, I am interested in finding out if it is possible to manually adjust the localization from the controllers based on the URL. For example, accessing http://example.com/en would display the English version, while http ...

javascriptnode.jslocalizationsails.js

How can I resolve a MySQL query error in Node.js that is throwing an undefined error?

There seems to be an issue with the second request returning undefined instead of showing the results. The expected behavior is that if the first request returns less than two lines, the second request should be executed. What could be causing this error ...

javascriptmysqlnode.js

Navigating to the parent Vue component in a Vue3 project with Composition API structure in WebStorm

After transitioning to Vue3 and embracing the Composition API style, I find myself missing a small convenience that I had when developing in the previous Options API pattern. In WebStorm/IntelliJ IDE, I used to be able to command-click (Mac) on the "export ...

javascriptvue.jsvuejs3webstormvue-composition-api

Using Vue to perform multiplication on data table entries

Is there a way I can use Vue.js to multiply values in a table? The values provided are for 100g of the product. For example, if I input 200g, I would like the values to double: 318kcal, 12 fat, 48 carbs, 8 protein, and 2% iron. Similarly, inputting 50g sho ...

javascriptvue.jsvuetify.js

unexpected JSON response

I am facing an issue with JSON requests. On a page, I have two separate requests - the first one functions correctly, but the second keeps throwing an unexpected token error that is puzzling to me. The first AJAX call: $.ajax({ type:'PO ...

phpajaxjson

Utilize Angular to transform a JSON string into HTML text featuring organized bullet points

I am currently working on a project using Angular and I need to display some data from a JSON file on a webpage. The issue I am facing is that the message is quite lengthy, and I would like it to be presented in bulleted points. "messageToDisplay" ...

htmljsonangular

Enliven the character limit reaction by incorporating a thrilling shake animation when it reaches

I have implemented a feature in my component where if a user reaches the character limit, the component should shake. However, despite my efforts, the shaking effect is not working in the current code. const useStyles = makeStyles(() => ({ shake ...

javascriptreactjsmaterial-ui

Dynamic Checkbox Functionality in REACT

Motivation: My goal is to generate multiple rows with a variable number of checkboxes that will be managed by a useState hook. Challenge: The page freezes or displays constant loading, with no content visible. There are no console logs, and even the debug ...

javascriptreactjscheckboxmaterial-ui

How can one properly utilize material-ui CSS?

Just starting out with material-ui and react, I'm currently following this palette customization guide from Material-UI. However, when attempting to replicate the example shown, I encountered the error: Cannot read property 'prepareStyles' ...

javascriptcssreactjsmaterial-ui

Transforming Json to Avro schema

Issue I am looking to convert a regular Json file into an avro schema for compatibility with apache kafka and the confluent schema registry. Example Input (Json) [ { "name": "Robin Hood", "department": "", "manager": "", "salary": 200 ...

jsonapache-kafkaavroconfluent-schema-registry

Tips for incorporating additional file attachments in MVC and jQuery for uploading files

After exiting Yahoo, a new feature was introduced for attaching files. Once you click on the "Attach more files" button, it transforms into a single field where you can insert the file. The code snippet is shown below: <a href = "javascript: addUploa ...

javascriptjqueryasp.net-mvc-3asp.net-mvc-4

The Process of Developing Applications

As a newcomer to web development, I have a solid understanding of HTML and CSS, and am learning JavaScript. When considering creating a web app, would it be better for me to focus on writing the functionality in JavaScript first before integrating it int ...

javascriptangularjsweb-applicationsreactjs

Issues encountered with AngularJs filter search functionality

Why am I having trouble adapting this search filter from here? This is what my code looks like: controllers.js angular.module('starter.controllers', ['starter.services']) .controller('AppCtrl', function($scope, $ionicModal ...

javascripthtmlangularjs

Extracting information from the callback function

As I utilize AngularJS, I find myself constantly facing the challenge of managing asynchronous behavior and callback functions. How can I adjust PostsService.getPostBySlug to retrieve the desired post below? Custom Posts service Website.factory( 'Po ...

javascriptangularjs

Display the input in the text box before making a selection from the dropdown menu

Latest Technologies: $(document).ready(function(){ $('#userID').change(function(){ $('#username').val($('#userID option:selected').data('username')); }); }); Coding in HTML: <select class="form- ...

javascriptjqueryhtmlajax

Ways to transform a JSON string into an NSString using a specific key

I have a NSDictionary with the following JSON string: { "119": { "name": "Tidy The House", "url": "https://www.website.com" } } Is there a way to extract the name from this JSON string? ...

iosobjective-cjson

Issue with DataTables: Uncaught TypeError occurs when trying to read the property 'length' of an undefined value

Here's the AJAX call I'm using for the DataTables table object. My goal is to populate a table with rows of JSON data, as the header rows are already in place. I'm struggling with understanding the syntax of DataTables ajax calls, as it see ...

c#ajaxjsondatatables

Personalizing the React Bootstrap date picker

I am currently working on customizing the react-bootstrap-daterangepicker to achieve a specific look: My goal is to have distinct background colors for when dates are selected within a range and when the user is hovering over dates to make a selection. I ...

javascripthtmlcssreactjsreact-bootstrap

Sort various divs using a list

I have multiple divs containing different content. On the left side, there is a list of various categories. When a category is clicked, I want to display the corresponding div for that category. Initially, I want the main category to be loaded, with no opt ...

javascripthtmljqueryfilter