Why does the request for server parameter 'occupation=01%02' function correctly, while 'occupation=01%2C02' or 'occupation=01&occupation=02' result in an error?

There seems to be an issue with the parameter when using the API to request data from the server. The value 'occupation=01%02' works correctly when entered directly into the browser URL, but errors occur when using 'occupation=01%2C02' (,) or 'occupation=01&occupation=02'.

This problem arises specifically when requesting multiple values from checkboxes to the server.

I am wondering if this could be an encoding problem. If not, where could I have made a mistake?

I am working on an HTML5 client and receiving 10 items at a time from the server which are then paginated.

In Java:

uri = new URIBuilder()
                .setScheme("http")
                .setHost("openapi.work.go.kr")
                .setPath("/opi/opi/opia/wantedApi.do")
                .setParameter("returnType", "xml")
                .setParameter("startPage", requestVo.getStartPage())
                .setParameter("callTp", "L")
                .setParameter("region", "30200")
                .setParameter("occupation", requestVo.getOccupation())
                .setParameter("keyword", requestVo.getKeyword())
                .setParameter("authKey", requestVo.getKey())
                .build();

In JSP: the checkbox id is occupation_chbox and I populate the value in

<input type="hidden" name="startPage" value="1">

Using JavaScript:

function jobsubmit(){
    var form = document.getElementById("requestForm");
    var occ = checkOcc();
    $("#occupation").val(occ);
    console.log($("#occupation").val());
    form.submit();
}

function checkOcc(){
    var chk_arr = [];
    $("input[id='occupation_chbox']:checked").each(function(){
        var chkBox = $(this).val();
        chk_arr.push(chkBox);
    });
    console.log(chk_arr);

    var occ="";
    for(i = 0; i<chk_arr.length; i++){
   
        occ += (i < chk_arr.length - 1) ? chk_arr[i] + "," : chk_arr[i];
    }
    console.log(occ);

    return occ;
}

Answer №1

The issue was resolved by adjusting the separator from a comma to a vertical bar.

occ += (i < chk_arr.length - 1) ? chk_arr[i] + "|" : chk_arr[i]

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

Configuring Multer destination dynamically using FormData values in Node.js

I have a scenario where I need to send a file along with some data values using an XMLHttpRequest (xhr) to a Node.js server running Express. To handle multipart data, I am utilizing Multer as bodyParser does not work in this case. router.post("/submit", f ...

Transferring a text message from C-based client to a Java server

I am currently facing a challenge in sending a string from my C client to a Java server, which then sends a text file back to the client. Below is the snippet of code from the client responsible for sending the string: int n = write(sock_fd,"Ready",5); i ...

When implementing tooltips in Apexchart's JavaScript, the y-axis second does not appear in the chart

Typically, when I append data to the second y-axis as an array, it works perfectly. However, for some reason, when I try to append a collection to the data, it no longer shows with two y-axes simultaneously. I even tried adding x and y as the Apex documen ...

Creating Interactive Graphs with HTML and JavaScript: A Guide to Dynamic Graph Drawing

I am seeking to create a dynamic graph using standard HTML, JavaScript, and jQuery (excluding HTML5). The nodes will be represented by divs with specific contents, connected by lines such as horizontal and vertical. The ability to add and remove nodes dyn ...

Rearranging a two-dimensional array of strings based on the last name without using any collection

Yesterday, I had an interview with an organization where I put my best effort into everything. However, I struggled to come up with a logic for sorting the last names in the following array without using any Collection.sort or CompareTo() method: String [ ...

JavaScript - Sort an array containing mixed data types into separate arrays based on data

If I have an array such as a=[1,3,4,{roll:3},7,8,{roll:2},9], how can I split it into two arrays with the following elements: b=[1,3,4,7,8,9] c=[{roll:3},{roll:2}]. What is the best way to separate the contents of the array? ...

Combine functions from two objects that share the same properties into an array for each property

I need help combining the methods from two objects into one, resulting in an array of methods for each property in the parent object: obj1 = {"prop1":"method1","prop2":"method2"} obj2 = {"prop1":"method3","prop2":"method4"} Expected result: obj1 = {"pro ...

Utilizing $stateParams within a personalized ui-router configuration attribute

Attempting to retrieve data from $stateParams within a custom ui-router state configuration property results in an empty object being logged. This outcome is anticipated given that I am straying from the standard ui-router configuration. Despite this devi ...

Struggling to Parse JSON Responses?

Utilizing AJAX/JQuery to communicate with a WCF service presents its own set of challenges. One common method is implementing .NET try/catch error-handling on the service-side to manage different scenarios, such as user timeout errors. Typically, the servi ...

Processing a JSON array of objects in AngularJS

When using Angular's fromJson function to parse a JSON string, I encountered an issue. If the JSON is a simple array like "[1, 2]", the code works fine. However, I need to work with an array of dictionaries instead. var str = "[{'title' ...

Insert a JSX element into the body of a webpage using React JSX

Is there a way to dynamically add elements to the end of the body using vanilla JavaScript? const newRecipe = <div id = "container"> <div className="recipe App" id="four" onClick={this.toggleRecipeList.bind(this)}>{this.state.recipeName} < ...

Can VueJS Computed handle multiple filters at once?

I am encountering an issue with this code - when I attempt to add another filter inside the computed section, it doesn't work. However, if I remove the additional filter, the code functions correctly. My goal is to have both company and product searc ...

JQuery/JS function not functioning as expected

Creating HTML with jQuery to retrieve data from a web API. At the start of my script, I defined a function that checks the selected value of a dropdown and assigns it to a global variable. var $seldom; $(document).ready(function () { function chkdom() ...

Navigating to a form within an Angular-UI uib-tab

Is it possible to access a form within a uib-tab for validation purposes? To see an example, check out this plunker: http://plnkr.co/edit/8hTccl5HAMJwUcHEtnLq?p=preview While trying to access $scope.forminside, I found that it's undefined (referring ...

What is the best way to implement horizontal content scrolling when an arrow is tapped in mobile view?

I recently created a JS Fiddle that seems to be working fine on desktop, but in mobile view, the square boxes have horizontal scrolling. Here are the CSS codes I used for this particular issue: @media only screen and (max-width: 767px) { .product-all-con ...

BottomNavigation wrapping React Router is failing to load the updated component

I'm struggling to understand why I can't seem to load the DMO page from a BottomNavigation component. Navigating to "/dom" works fine, but clicking the buttons doesn't do anything. The initial "/" loads perfectly. Any ide ...

MUI AutoComplete does not currently support the type number with maxLength restriction. What steps can be taken to resolve this issue?

Hey there, I'm encountering an issue where maxLength is not working on the AutoComplete component when the input type is set to number. Any suggestions on how to resolve this? export default function Select({ onChangeInput, label, name, ...

The AJAX response doesn't seem to be halting

My AJAX request looks like this: $.ajax({ url: "AutoRFQ_Vendors_ST.aspx/BindVesselGrid", type: "POST", timeout: 3000, data: JSON.stringify(sendingdata), ...

Implementing method overrides in TypeScript class objects inherited from JavaScript function-based classes

I am facing a challenge with overriding an object method defined in a JavaScript (ES5) function-based class: var JSClass = function() { this.start = function() { console.log('JSClass.start()'); } } When I call the start() method, it pri ...

The priority of custom attributes in HTML

There seems to be some ambiguity regarding whether data- attributes should be considered primary or secondary syntax. Is there a defined standard for this in major frameworks like Angular? For example, if an attribute is specified as both my-attr and dat ...