Using JavaScript to launch a new window with an array of parameters

I am working on an asp.net mvc 3 application that has an Action Method for handling GET requests and returning a page. The code snippet is shown below:

[HttpGet]
public ActionResult Print(IEnumerable<string> arrayOfIds)
{
    .......................
    return View(someModel);     
}

There is also JavaScript code that invokes this action:

window.open('@Url.Action("Print","Appointments")' + urlArray, "Print", "width=620,height=410,scrollbars=yes");

The issue arises when the urlArray becomes very large. Is there a way to pass this data to the Action Method without using a URL string (perhaps by utilizing the content of the HTTP Request)? This is necessary because the URL size is causing issues with browser handling.

UPDATE: In case my previous explanation was unclear... I have found a solution to my problem. Here is the updated JavaScript code:

$.ajax({
        url: '@Url.Action("Print","Appointments")',
        type: "POST",
        data: { listOfIds : listOfIds },
        dataType: "text",
        traditional: true,
        success: function (data) {
            printWindow = window.open('', 'Print');
            printWindow.document.write(data);
        }
    });

Additionally, I changed the attribute of the Action Method from HttpGet to HttpPost.

Answer №1

Your inquiry may not be directly related to JavaScript as the URL restriction is a characteristic of HTTP GET. Utilizing HTTP POST, which is not compatible with window.open(), is suggested.

Nonetheless, there is a workaround...

window.open('about:blank', 'Print', 'width=620,height=410,scrollbars=yes');
document.myForm.target='Print';
document.myForm.urlArray=urlArray;
document.myForm.submit();

This will initiate a new window and send an existing HTML form (method="post") to the newly opened window. In this illustration, it assumes a concealed field named "urlArray", but you must provide whatever your Action Method necessitates.

If there is already a form on the webpage that gathers the urlArray data, you can streamline this process by directing the form to a new window created by the onsubmit event handler of your form.

Answer №2

To enhance your practice, consider submitting a form to the current page (allowing for data transfer to the server side via POST) and then utilizing RedirectToAction to transmit your information at the server end.

This method is more efficient. You can utilize Javascript to submit the form. Instead of using window.open, opt for form.submit()

UPDATED:

Incorporate target="_blank" into your form tag to display the results in a new window.

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

What is the procedure to obtain a session object on the server side in next.js version 14?

I am currently utilizing version 14 of next.js with its app routing feature and NextAuth. My goal is to secure the API, however, I encounter a null object when using the getServerSession( authOptions ) method while attempting to access a protected endpoin ...

Angular is used to call a function that captures a specific div and then waits for the capture to be completed before

I'm facing a challenge where I need to handle the capturing of a div using a method called capture() within another method. Take a look at the code snippet below: theimage; // declaring the variable callcapture() { // perform certain actions t ...

Convert your AS3 code to JavaScript with our specialized compilers

Recently, I came across the AS3 to JS compiler known as Jangaroo. It caught my attention because it seems like a valuable tool that aligns well with my preferences in AS3. Are there any similar compilers out there? Is there another programming language ...

AngularJS: Issue with scope not updating across several views

Having one controller and two views presents a challenge. ClustersController angular.module('app.controllers').controller('ClustersController', [ '$scope', 'ClustersService', function($scope, ClustersService) { ...

What are the different applications of npm packages?

Is it possible to use npm packages in any Javascript runtime environment? I have experience using them in Angular and Node, but are they universally compatible across all environments? Edit: To those who downvoted this post, as a newcomer seeking assistan ...

How to italicize a portion of output using JavaScript

There are numerous inquiries on the internet and on this site regarding how to make italic fonts, however, none specifically address how to italicize only a section of a string. In my scenario, I have a form where I input the book title, author's nam ...

The shopping cart in our e-commerce website is refreshed in real-time thanks to the integration of J

I am currently enhancing the Codeigniter Cart with JQuery by making an Ajax call for updates. Below is my JQuery function: $(function() { $('.cart_form select').on('change', function(ev) { var rowid = $(this).attr('c ...

Tips on maximizing efficiency in number game coding

Seeking to create a number using a specified set of 6+ inputs. For instance, aiming for the number 280 with inputs [2,4,5,10,30,50,66], the desired output format would be something like this: ((2+5) * 4 * 10). Each input number can only be used once per s ...

Trick to bypass inline script restrictions on Chrome extension

I have developed a Chrome extension with a feature that involves looping a list of links into a .div element. Here is the code snippet: function updateIcd() { modalIcdLinks.innerHTML = ''; let icdLinks = ''; for (let i = 0; i < icd ...

Interdependent function calls between two functions

When faced with the task of recursively checking two objects with sorted keys, I came up with a solution involving two functions. buildObj - this function retrieves all unique keys from the objects, sorts them, and then calls buildObjKey for each key bui ...

"When setting up a window.EventListener, the Div element fails to be hidden when setting its display property to 'none

I'm working on creating a preloader by displaying an overlay until all the content on the page is loaded. However, despite checking my code multiple times, I can't seem to figure out why it's not working. If anyone could provide some assist ...

encountering a problem with permissions while attempting to update npm

Has anyone encountered a permission error with npm when trying to update to the latest version? I recently tried updating npm and received this error message. I'm unsure of how to resolve it. Any suggestions? marshalls-MacBook-Air:Desktop marshall$ n ...

When trying to access the key value of a dynamically generated object, it returns as undefined

I am facing a challenge with my student object structure... { Freshmen: [{id: 3}, {id: 5}], Sophomores: [{id: 2}, {id: 6}], Juniors: [{id: 1}, {id: 8}], Seniors: [{id: 9}, {id: 4}, {id: 7}] } My goal is to retrieve full student objects from the d ...

Issues with Firefox Protractor testing functionality

Trying to test a protractor on an angularjs application using Firefox 47 has been unsuccessful. Attempted downgrading to version 46.0.1 after researching on Stack Overflow, but still facing issues. Has anyone discovered a working solution for this? It seem ...

Switching the background image when hovering over a list element

Looking at the screenshot, it's clear that there is an unordered list with a background image set on the div. What I am trying to achieve is to have the background image change whenever I hover over a list item. Each list item should trigger a differe ...

Stop the replication of HTML/CSS styles during the extraction of content from a div

Is there a way to prevent the copying of CSS properties, such as font styles and sizes, when content is copied from a div? I want only the plain text to be copied to the clipboard, without any formatting applied. ...

Aurelia-powered DataTable plugin for effortless data updating

I'm currently utilizing the DataTables and DatePicker plugins along with Aurelia in my project. The goal is for the user to select a date, which will then prompt the data table to display the corresponding data for that specific date. However, I' ...

Invoke a function via ajax with no return value

Here is the ajax code I am using to call an action in Controller B while currently in Controller A. The params are sent to the action correctly, but the view does not render as expected. I suspect that it may be returning the view instead. Index.cshtml (o ...

The use of JSON.parse does not support parsing URL links

As a junior developer specializing in Javascript and Google Apps Script, I decided to enhance the functionality of my Google Sheets by tracking the last modification time of URLs stored in them. Although I attempted to create a script for this task, it see ...

Delete any HTML content dynamically appended by AJAX requests

I'm currently working on a page dedicated to building orders, where the functionality is fully dependent on ajax for finding products and adding them dynamically. However, I encountered an issue when attempting to remove an item that was added via aj ...