将csv文件加载到javascript文件中

Question

Is this possible ? I am wanting to pull out a price of a product from the csv file and tie that price to its particular part number.

I am doing this for a website and I am learning script programming at the same time, and I am unsure how to do this.

The JS file would call the csv file and pull the price and part number out of it.

From there the JS file will create a form to use with a Paypal shopping cart.

This is the paypal shopping cart code for the add to cart button:

<form target="paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_cart">
<input type="hidden" name="business" value="XXXXX">
<input type="hidden" name="lc" value="US">
<input type="hidden" name="item_name" value="PartNumber1">
<input type="hidden" name="amount" >
<input type="hidden" name="currency_code" value="USD">
<input type="hidden" name="button_subtype" value="products">
<input type="hidden" name="cn" value="Add special instructions to the seller">
<input type="hidden" name="no_shipping" value="2">
<input type="hidden" name="weight" value=".5">
<input type="hidden" name="weight_unit" value="lbs">
<input type="hidden" name="add" value="1">
<input type="hidden" name="bn" value="PP-ShopCartBF:btn_cart_LG.gif:NonHosted">
<input type="image" src="https://www.paypal.com/en_US/i/btn/btn_cart_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
<img alt="" border="0" src="https://www.paypal.com/en_US/i/scr/pixel.gif" width="1" height="1">
</form>

Using the variable I added to this button, the JS file would look similar to this:

function CalculateOrder(form)
{

if (form.item_name.value == "PartNumber1"
{
form.amount.value = (The price variable would go here);
}

if (form.item_name.value == "PartNumber2"
{
form.amount.value = (The price variable would go here);
}
}

What I need before this code in the JS file is the code that loads the csv file and outputs the price and part number. The JS file would search for the part number labelled called "PartNumber1" and output the appropriate price from the csv file.

HELP PLEASE !!

Answer 1

It is possible, but quite possibly more trouble then it is worth.

First you have to get the CSV data. This is easy, so long as it resides on the same server as the site - XMLHttpRequest is your friend. You can get the raw CSV out of of the responseText.

Then you need to parse it.

If you have a very simple CSV file, then you can split first on new lines (to get each row) and then on commas (to get each column).

Without testing, something like this might do the trick:

var csv = myXHR.responseText;
var rows = csv.split("\n");
for (var i = 0; i < rows.length; i++) {
  rows[i] = rows[i].split(",");
}

You could then look for the part number you want with:

var getPart = function getPart(partNumber) {
  for (var i = 0, j < rows.length; i < j; i++) {
    if (row[i][partNumberColumnIndex] === partNumber) {
      return row[i];
    } 
  }
};

However, CSV isn't as simple a data format as it looks at first .

If any of the data has a comma or a new line in it, then you can't simply split on those characters since you have to watch out for quote characters.

If I had CSV data that I really wanted to deal with on the client, then I would use Text::CSV and JSON::Any to convert to a format that JavaScript can parse natively before sending it to the client.

For this particular task, I'd probably forget about doing it client side altogether and just do everything on the server. I can't see much benefit on pushing this work off to the client. (Although, admittedly, I don't know all the details).

Answer 2

Sometime ago I wrote a script which downloads a CSV and plots the points . Perhaps it's a good starting point for you.

Answer 3

如果您需要一个支持CSV RFC棘手部分的JavaScript CSV解析器，则可能需要看一下我对解析器的实现 -但是请注意，这只是第一个版本，仍然需要清理一下。