How to save text values from web page locally and is it possible to have web page front end, C# back end?

Question

I am creating a web page that will have many text input boxes structured like the below example.

<input type="text" id="textID" name="textName" placeholder="Enter your text here">

I will have a button at the bottom of the page that I want to grab all the values from each text box, preferably if possible Serialize into XML format and then save locally. If Serializing is not possible, saving to a txt/doc/etc will work. I am using javascript to do that work.

I have figured out how to have my button when clicked save a document of my choosing locally, but I have to use a web url to pull from and this only saves the page source code. That does me no good. I cannot figure out what to put in place of the below save.href. The save.href is forcing the use of the URL which I do not want.

<HTML>
//web page stuff

//Many of these inputs like this one below
<input type="text" id="textID" name="textName" placeholder="Enter your text here">

<script language="javascript" type="text/javascript">

function SaveData() 
{
  var fileURL = "http://localhost:51088/index.html";
  var fileName = "test.txt";


  if (!window.ActiveXObject) 
  {
    var save = document.createElement('a');
    save.href = fileURL;
    save.target = '_blank';
    save.download = fileName || 'unknown';

    var event = document.createEvent('Event');
    event.initEvent('click', true, true);
    save.dispatchEvent(event);
    (window.URL || window.webkitURL).revokeObjectURL(save.href);
  }

    // for IE
  else if (!!window.ActiveXObject && document.execCommand) 
  {
    var _window = window.open(fileURL, '_blank');
    _window.document.close();
    _window.document.execCommand('SaveAs', true, fileName || fileURL)
    _window.close();
 }
}
</script>
</HTML>

This code above is producing a text file that downloads locally to my box but it is only of the page source code for the URL I provided. How can I grab all the values from the text boxes and save that data locally?

I know I can do something like this example below to grab the text box values but how can I then take this value and save it?

var textBoxValue = document.getElementById("textID").value;

And an additional path I ultimately would like to take is to somehow write a C# business layer code that can bind directly to the text boxes on the web page. If not bind, at least pass the values to the C# code. If I can achieve that then I can handle formatting, saving, etc within C#. Is it possible to have an HTML web page, with JavaScript as the UI and C# as the back end?

score 0 · Answer 1 · edited May 23 '17 at 12:06

0

Is it possible to have an HTML web page, with JavaScript as the UI and C# as the back end?

Yes it is possible, using a website project or even a web application project from visual studio at least.

Additionally, the answer at How to write data to textfile using JavaScript may be what you are looking for to troubleshoot the saving text box values to a text file.

edited May 23 '17 at 12:06

Community

1
1

answered Oct 30 '14 at 20:28

austin wernli

1,801
12
15

Do you have a link to point me to some resources on how to make use HTML as the UI and C# as back end? Also, I checked out the link to writing the text file but that did not work out. – Keith Prince Oct 30 '14 at 20:53
Is this what you are looking for? It's very brief, but explains the point and how to. http://msdn.microsoft.com/en-us/library/ms243156(v=vs.100) – austin wernli Oct 30 '14 at 21:38

score 0 · Accepted Answer · answered Nov 03 '14 at 14:50

I have managed to figure out how to grab the values from each text box and save them to a text file. Code sample below does it. Now to research how to put this in XML format.

var userInput = document.getElementById("userInputId").value;

var fileURL = 'data:application/notepad;charset=utf-8,' + encodeURIComponent(userInput);
var fileName = "test.txt";


if (!window.ActiveXObject) {
  var save = document.createElement('a');
  save.href = fileURL;

  save.target = '_blank';
  save.download = fileName || 'unknown';

  var event = document.createEvent('Event');
  event.initEvent('click', true, true);
  save.dispatchEvent(event);
  (window.URL || window.webkitURL).revokeObjectURL(save.href);
}

// for IE
else if (!!window.ActiveXObject && document.execCommand) {
  var _window = window.open(fileURL, '_blank');
  _window.document.close();
  _window.document.execCommand('SaveAs', true, fileName || fileURL)
  _window.close();
}

How to save text values from web page locally and is it possible to have web page front end, C# back end?

2 Answers2