JavaScript - File Upload Problem Javascript

Hello every one never really used a board for something like this but my java is a little limited so i need some help here if possible!

I have a page with 5 file inputs and 5 img tags i have everything working but preview of course changes all the img tags so no madder what browse button i choose all fixed img tags are updated with that preview.

here is a code i found and messed with a little cant seem to figure out how to add a loop or something to update just the called tag if any one could help

Java Script:

<script type="text/javascript">
<!-- Begin
/***** CUSTOMIZE THESE VARIABLES *****/
// width to resize large images to
var maxWidth=115;
// height to resize large images to
var maxHeight=115;
// valid file types
var fileTypes=["bmp","gif","png","jpg","jpeg"];
// the id of the preview image tag
var outImage="previewField";
// what to display when the image is not valid
var defaultPic="/images/evolve/badpic.jpg";
/***** DO NOT EDIT BELOW *****/
function preview(what){
var source=what.value;
var ext=source.substring(source.lastIndexOf(".")+1,sou rce.length).toLowerCase();
for (var i=0; i<fileTypes.length; i++){
if (fileTypes[i]==ext){
break;
}
}
globalPic=new Image();
if (i<fileTypes.length){

//FireFox
try{
globalPic.src=what.files[0].getAsDataURL();
}catch(err){
globalPic.src=source;
}
}else {
globalPic.src=defaultPic;
alert(fileTypes.join(", "));
}
setTimeout("applyChanges()",200);
}

var globalPic;
function applyChanges(){
var field=document.getElementById(outImage);
var x=parseInt(globalPic.width);
var y=parseInt(globalPic.height);
if (x>maxWidth) {
y*=maxWidth/x;
x=maxWidth;
}
if (y>maxHeight) {
x*=maxHeight/y;
y=maxHeight;
}
field.style.display=(x<1 || y<1)?"none":"";
field.src=globalPic.src;
field.width=x;
field.height=y;
}
// End -->

previewField is the key i think and also of course the imageout jsut dont know how to go about making the loop if this was perl no problem but like stated above i know little about java coding but minor changes.

below here is the some of the form code:

<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td scope="col">
<img alt="Graphic will preview here" id="previewField" src="/images/evolve/addpic.jpg" width="115" height="115"><br />
<label class="cabinet"><input type="file" name="images[]" id="picField" onchange="preview(this)" class="file"></label>
</td>
<td scope="col">
<img alt="Graphic will preview here" id="previewField" src="/images/evolve/addpic.jpg" width="115" height="115"><br />
<label class="cabinet"><input type="file" name="images[]" id="picField" onchange="preview(this)" class="file"></label>
</td>
<td scope="col">
<img alt="Graphic will preview here" id="previewField" src="/images/evolve/addpic.jpg" width="115" height="115"><br />
<label class="cabinet"><input type="file" name="images[]" id="picField" onchange="preview(this)" class="file"></label>
</td>
<td scope="col">
<img alt="Graphic will preview here" id="previewField" src="/images/evolve/addpic.jpg" width="115" height="115"><br />
<label class="cabinet"><input type="file" name="images[]" id="picField" onchange="preview(this)" class="file"></label>
</td>
<td scope="col">
<img alt="Graphic will preview here" id="previewField" src="/images/evolve/addpic.jpg" width="115" height="115"><br />
<label class="cabinet"><input type="file" name="images[]" id="picField" onchange="preview(this)" class="file"></label>
</td>
</tr>
</table>

also ther is one include:

<script type="text/javascript" src="/java/si.files.js"></script>

i went through this code file and the change does not appear to be where the change should ocur im sure its in the actually script need to loop through the images[] field i would think like i would in php

The only thing i could think to do is paste the script code 5 more times and change each variable to 1 2 3 4 5 but then ill have a big php code page there would be a way to make this work i would think

Thanks all and im here for PHP or Perl questions so any help would be great!
If there is a better approach any input would be great!

I'm hoping someone can help me out on this. I know that the input "file" type can't be customized very well using css, so I figured I might try to make my own with javascript. The only problem is, I don't know too much about javascript. So can someone please point me in the right direction on how to make my own custom file upload box in javascript that works the same way as the default one works (so I don't have to edit my PHP coding). Thank you so much!

Also, heres something I'd like to achieve:


The box I'd like to create is at the top, while the default one is at the bottom.

hi

i m creating a webpage using javascript and php

where i need to upload a doc file or zip and read all the words in doc file

if it is zip i need to read all the words in all the doc files.

i m trying to upload using file input but it does not show path of file only file name

how i m suppose to upload and read it.

i have a html/php form which let users upload pictures onto my server. the problem with it is, it says the picture has been uploaded but if the file name contains any of character apart from text (A-z) and numbers, the picture never shows up in the admin panel.

is there a way using ajax or jquery to disallow certain file names in the upload field of the html which uses these characters !@#$%^'&*()"?

how do i go on about this?

hi,
i am using <input type = "file" id = "upload"> in my html page. i want to disable the textbox of this control so that user cannot type any file location here. user can upload file only through browse button.

is there a way to disable this textbox thru javascript?

thnx

Hey there everyone

I'm a bit new to javascript and having a bit of a problem.

I have a page users can click to upload a photo. When users click I want a modal window to pop up with a simple file upload input inside it and a submit button. I have this working except that when users click submit nothing happens. I'm using nyroModal http://nyromodal.nyrodev.com/#demos and the code I use is:

Code:

<a href="#test" class="nyroModal"><img src="/img/uploadimage.gif" alt="" /></a>
<div id="test" style="display: none; width: 600px;"> <form id="ImageUploadForm" enctype="multipart/form-data" method="post" action="images/upload" accept-charset="utf-8">
<div style="display:none;">
<input type="hidden" name="_method" value="POST" />
</div>
<div class="input file">
<label for="ImageFileName">File Name</label>
<input type="file" name="data[Image][fileName]" id="ImageFileName" />
</div>
<div class="submit"><input type="submit" value="Upload" />
</div>
</form>
</div>

If I take the code out of the div=id"test" the form appears on the normal page and submits just fine. Inside the test div tho the modal window pops up with the form inside but the submit button does nothing.

Can anyone enlighten me what I'm doing wrong?

Please help ... bit urgent
I am creating a small automated system where front-end is html query form and back-end database is MS excel. both at local PC only & in a single folder. problem is like a survey form. continuous data entry, error correction, read/wite all these are included.
I created a program upto first entry; but the second, third, ... entries and it is continuous. pl help me
regards
K.Kaniraj

So I have a file that factors quadratics.

It works just fine when I open the file from my desktop, but when I upload it and try to use it, the javascript stops working.

Any ideas?

This is the file: http://wdroom.com/factor.html

You can try it out there, or you can download it.

I can't get it to work at all for some reason...

Thanks!

I can get this code to take two separate sections of a file which are not beside each other and write them into another file. It always comes up as a single full line of the code instead of the sections I want. The code includes the student number first name last name and three results of assignments. I want the code to write the student number and three results of all the students into a file and then work out the average of the student results. Can you help?

Code:

 try{                    
               while (in.hasNextLine())
               {
                  String line = in.nextLine();
                  out.println( line);
                  int i=0;
                  if(!Character.isDigit(line.charAt(i)))  { i++; }
                  studentStringNumber = line.substring(0, i);
                  String stringResult = line.substring(i);
                              	
                  studentStringNumber = studentStringNumber.trim();
                  stringResults = stringResults.trim();
                  double stringResultsValue = Double.parseDouble(stringResults.trim());
                  stringResults = in.nextLine();
                              	
                                 
                  studentStringNumber = in.nextLine();
                  studentNumber = Integer.parseInt(studentStringNumber);
                  if(in.hasNextInt())
                  {
                     int value = in.nextInt();
                  }
               						 					   
                  results = Double.parseDouble(stringResults); 
                  if(in.hasNextDouble())
                  {
                     double value = in.nextDouble();
                  } 
               						               	
                            	
                  Scanner lineScanner = new Scanner(line);
                  studentStringNumber = lineScanner.next();
                  while(!lineScanner.hasNextDouble())
                  {
                     studentStringNumber = studentStringNumber+ " " +lineScanner.next();
                  }
                  stringResultsValue = lineScanner.nextDouble();     
               }
            }

Does anyone know how to accomplish this? I got the html file to show but none of the text in the file will show.

Hi i am using javascript for the first time and i have a problem .I have 2 files html and javascript file in seperate but i donot know how to make them work .the code is down below .Thanks in advance for help.


HTML
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<meta name="description" content="Instagram API - usage" />
<meta charset=utf-8 />
<title></title>
</head>
<body>
<input id="lat_input" type="number" value="60.221374"/>
<input id="lng_input" type="number" value="24.805391"/>
<button id="search_location">Search</button><br/>
<button id="get_popular">Get popular</button>
<div id="images"></div>
</body>
</html>



Javascript file


// API DOCUMENTATION:
// Instagram Developer Documentation

var clientId = 'e7538f47e197479d8d32a63ae3ae4cd2';

$('#search_location').click(function () {
getMediaByLocation($('#lat_input').val(), $('#lng_input').val());
});

$('#get_popular').click(function () {
getPopularImages();
});

function getMediaByLocation(lat, lng) {
var o = {
lat: lat,
lng: lng,
client_id: clientId
};

$.getJSON('https://api.instagram.com/v1/media/search?callback=?', o, function (response) {
processImages(response.data);
});
}

function getPopularImages() {
var o = {
client_id: clientId
};

$.getJSON('https://api.instagram.com/v1/media/popular?callback=?', o, function (response) {
processImages(response.data);
});
}


function processImages(array) {
$('#images').empty();
$.each(array, function (index, element) {
var fs = $('<fieldset>').appendTo('#images');

$('<img>').attr('src', element.images.low_resolution.url).appendTo(fs);

if (element.caption) {
$('<pre>').text(element.caption.text).appendTo(fs);
}

$.each(element.comments.data, function (index, comment) {
$('<pre>').text('Comment from ' + comment.from.full_name + ': ' + comment.text).appendTo(fs);
});

});
}

Hi,

I have the following code snippet:
test.html
======
<script language="javascript" type="text/javascript">
var testVariable = "test";
</script>
<script language="javascript" type="text/javascript" src="test.js">
</script>

test.js
=====
var testVariable = window.top.testVariable;

In firefox, I'm able to access testvariable defined within test.html in test.js.

But in chrome, test.js couldnot get the window.top.testVariable field defined in test.html.

Can any one please let me know how i can make it work in chrome?. Am i missing something here?.

Dear All

I have a .js file in which i have pasted Urdu text and HTML tags like

function urdutext()
{

innerHTML.right_column='HTML tags & urdu text';}

The .js file contains about eighty lines of urdu text and some HTML tags in betweeen.

But when i run this file alone in my browser it displays half of the file and the rest of the lines remain undisplayed.

and when i use this file in my web page and when i click a button to display the urdu text, it dispays nothing in my web page.

I know the reason but i cant solve it my self.

The reason is that the .js file does not get fully uploaded and hence the file remains open and the syntax become wrong. And that is the reason it does not display anything in the web page.

So i want ut help. Any one can help and would take my best wishes.

Regards
Sajad Bhatt

Im coding a chat system, but the main thing which I cannot get working which is stopping me from doing this is displaying the data from the database.

I have made a test XML document for the time being so that I can get the JavaScript/AJAX working properly, then I will figure out why my PHP isnt generating the XML file properly.

Here is my XML document:
Code:

<?xml version="1.0" ?>
<root>
	<message id="0">
	<sender>martynball</sender>
	<receiver>someoneelse</receiver>
	<time>154375342</time>
	<text>Testing an XML document and seeing if the JavaScript will display it properly. 
	If so then there is a problem with the PHP.</text>
	</message>
</root>

And here is my JavaScript/AJAX, for some reason there is NOTHING being displayed in the div which has the correct ID.
Code:

<script type="text/javascript">
function getXmlHttpRequestObject()
{
if (window.XMLHttpRequest)
  {
  // code for IE7+, Firefox, Chrome, Opera, Safari
  return new XMLHttpRequest();
  }
if (window.ActiveXObject)
  {
  // code for IE6, IE5
  return new ActiveXObject("Microsoft.XMLHTTP");
  }
return null;
}
//Make variables for later use
var lastMess = 0;
var sendReq = getXmlHttpRequestObject();
var receiveReq = getXmlHttpRequestObject();
var mTimer;

function getMessage() {
	if (receiveReq.readyState == 4 || receiveReq.readyState == 0) {
		//var url = "scripts/get_data.php?uid=<?=$_SESSION['uid']?>&m=" + lastMess + "&chat=1";
		var url = "testXMLdoc.xml";
		receiveReq.open("GET", url, true);
		receiveReq.onreadystatechange = manageMessage;
		receiveReq.send(null);
		lastMess++;
	}
}
function manageMessage() {
	if (receiveReq.readyState == 4) {
		var xmldoc = receiveReq.responseText;
		var chat_div = document.getElementById('chat');
		var msg_nodes = xmldoc.getElementByTagName("message");
		var n_msg = message_nodes.length;
		for (i = 0; i < n_msg; i++) {
			var sender_node = msg_node[i].getElementByTagName["sender"];
			var receiver_node = msg_node[i].getElementByTagName["receiver"];
			var time_node = msg_node[i].getElementByTagName["time"];
			var text_node = msg_node[i].getElementByTagName["text"];
			chat_div.innerHTML = "He  <br />" + sender_node[0].firstChild.nodeValue + "<br />";
			chat_div.innerHTML = reciever_node[0].firstChild.nodeValue + "<br />";
			chat_div.innerHTML =time_node[0].firstChild.nodeValue + "<br />";
			chat_div.innerHTML = text_node[0].firstChild.nodeValue + "<br />";
		}
	}
}
</script>

Also, I put a alert under the manageMessage() function before the IF statement and that gets displayed.

Hi guys i have an embedded game in an html (unity3D) and i am wanting to delete a file from my server.

so at the moment i have a php file on my server and the html containing the javascript on my desktop.

test.php
PHP Code:
<?php
$conn = ftp_connect("ftp.domain.co.uk") or die("Could not connect");
ftp_login($conn,"username","password");

echo ftp_delete($conn,"test.txt");

ftp_close($conn);
?>

I will out the correct domian name and username and password and this should delete a file named test.txt on my server.

the problem i am having is calling this script from my javascript which is my main html:
i have searched all over and found if i do this :
Code:

<script language="JavaScript">
        function DELETE_SERVER_FILE()
        {
                dummyimage = new Image();
                dummyimage.src ="http://www.domain.co.uk/test.php"
        }

</script>

But this is not working, can anyone help?