Была поставлена задача сделать редактирование каталога товаров полностью на Ajax. Что касается передачи текстовых данных(названия, описания, ID и т.д.) и получения html-ответа, то тут всё понятно. Но с передачей изображений пришлось немного повозиться. В итоге появился следующий код:

                        
<?

if(is_Array($_REQUEST['VALUE']['IMG'])):

/*если есть данные ajax*/

	$Patch=$_SERVER['DOCUMENT_ROOT'].'/upload/img/';//путь до папки загрузок

	foreach($arParams['VALUE']['IMG'] as $img):

		if(isset($img)):

/*

* вырезаем лишнее

* у нас два разрешенных формата,

* поэтому при необходимости добавить

* под свои форматы

*/

			$img = str_replace('data:image/png;base64,', '', $img);

			$img = str_replace('data:image/jpeg;base64,', '', $img);

			$img = str_replace(' ', '+', $img);

/*перекодируем данные*/

			$data = base64_decode($img);

			$img_name=uniqid().'.jpg';

			$file = $Patch.$img_name;

			if($success = file_put_contents($file, $data)):

/*если файл создан, выведем ссылку на него*/?>

				<a href="<?=$file?>"><?=$img_name?></a><br>

			<?endif;

		endif;

	endforeach;

else:

/*иначе выведем страницу для загрузки*/	

?>

<link href="css/style.css" type="text/css" rel="stylesheet">

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

<!--script src="js/jquery.js"></script-->

<link rel="stylesheet" type="text/css" href="font/css/font-awesome.min.css" />

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<div class="Warring"></div>

<div class="ElementList">

	<div class="TitleList">загрузка изображений через ajax</div>

	<div class="img_file_list">

		<div class="img_file">

			<img src="" class="new img_file">

			<div class="add_file">добавить изображение</div>

			<input type="file" id='1' onClick="LoadFile('1')" class="img_file" name="IMG[1]">

			<a onClick="RemoveNewImg('1');" class="RemoveImg" title="удалить"><i class=" icon-remove"></i></a>

		</div>

	</div>

	<div class="ButtonBlock">

		<a class="icon-save" onClick="SaveNewElement();"> save</a>

	</div>

</div>

<div class="AnswerAjax">ответ ajax</div>

<div class="Shading"></div>

<script type="text/javascript">

//очищаем форму

function CleanForm(){

	$('div.img_file').remove();

	var new_id=1;

	$('.img_file_list').append('<div class="img_file"><img src="" class="new img_file"><div class="add_file">добавить изображение</div><input type="file" id="'+new_id+'" onClick="LoadFile('+new_id+')" class="img_file" name="IMG['+new_id+']"><a onClick="RemoveNewImg('+new_id+');" class="RemoveImg" title="удалить"><i class=" icon-remove"></i></a></div>');

}

//передаем файлы

function SaveNewElement(){

	var arValue= new Object;

	var i=0;

	$('img.new').each(function(){

		var Src=$(this).attr('src');

		arValue['IMG]['+i]=Src;

		i++;

	});

	$.ajax({

		type: "POST",

		url: "<?=$_SERVER['PHP_SELF'];?>",

/*передаем этому же файлу

* так что смотрите чтобы в

* ответ запроса не попал лишний

* html-код, иначе ответ будет не красивым =)

*/

		data: {'VALUE':arValue},

		success: function(e){

			$('div.AnswerAjax').html(e);

			CleanForm();

			$('div.Shading').hide();

		},

		beforeSend: function(){

			$('div.Shading').show();

		}

	});

}

//очищаем форму

function RemoveNewImg(id){

	$('input#'+id).parent('div.img_file').remove();

}

//предварительный показ изображения

function LoadFile(id){

	var img=$('input[id="'+id+'"].img_file').siblings('img.img_file');

	oFReader = new FileReader(), rFilter = /^(?:image\/jpeg|image\/png)$/i;//список разрешенных форматов

	oFReader.onload = function (oFREvent) {

		var url=oFREvent.target.result;

		img.attr({'src':url});

	};

	function loadImageFile() {

		if (document.getElementById(id).files.length === 0)

                    { return 1; }

		var oFile = document.getElementById(id).files[0];

//проверка формата файла

		if (!rFilter.test(oFile.type))

                    { $('div.Warring').text("Неверный формат изображения!"); return 0; }

//проверка размера файла

					if(oFile.size>2202009)

                    { $('div.Warring').text('Размер файла больше 2Мб!'); return 0; }

                oFReader.readAsDataURL(oFile);

		return 1;

	}

	$('input[id="'+id+'"].img_file').change(function() {

		if(loadImageFile()) {

//если файл загружет, то создаем новую кнопку загрузки

			var new_id=parseInt(id)+1;			

			$('.img_file_list').append('<div class="img_file"><img src="" class="new img_file"><div class="add_file">добавить изображение</div><input type="file" id="'+new_id+'" onClick="LoadFile('+new_id+')" class="img_file" name="IMG['+new_id+']"><a onClick="RemoveNewImg('+new_id+');" class="RemoveImg" title="удалить"><i class=" icon-remove"></i></a></div>');

			$('input[id="'+id+'"].img_file').siblings('img.img_file').show();

			$('input[id="'+id+'"].img_file').siblings('a.RemoveImg').show();

			$('input[id="'+id+'"].img_file').hide();

		}

	});

}

</script>

<?endif;?>