Tengo dos formularios en los cuales cargo documentos al servidor por medio de un Webservice .asmx en donde he usado Jquery y AJAX para el código del lado del cliente y C# para el lado del servicio, ambos formularios utilizan el mismo Webservice.
Para el primer formulario cargo el documento sin problema y luego puedo verlo en el servidor, pero para el segundo formulario también se carga sin problema pero ahí algo que me causa conflicto y es en la consola el siguiente mensaje de error:
Uncaught TypeError: Cannot read property 'split' of null
at HTMLButtonElement.<anonymous> (CargaCV.js:26)
at HTMLButtonElement.dispatch (jquery.min.js:2)
at HTMLButtonElement.y.handle (jquery.min.js:2)
Este es el código html de mi primer formulario
<div class="form-group">
<label for="recipient-name" class="col-form-label">Adjunta tu CV</label>
<input type="file" id="FileUpload1" accept="application/pdf" />
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
<button id="btnSave" type="button" class="Enviar">Enviar</button>
</div>
El siguiente es la función JQuery de mi primer formulario.
CargaCV.js
$(function () {
var reader = new FileReader();
var fileName;
$('[id*=FileUpload1]').change(function () {
if (typeof (FileReader) != "undefined") {
var regex = /(.pdf)/;
$($(this)[0].files).each(function () {
var file = $(this);
if (regex.test(file[0].name.toLowerCase())) {
fileName = file[0].name;
reader.readAsDataURL(file[0]);
} else {
alert(file[0].name + " no es un formato de archivo valido.");
return false;
}
});
} else {
alert("This browser does not support HTML5 FileReader.");
}
});
$("[id*=btnSave]").click(function () {
var byteData = reader.result;
byteData = byteData.split(';')[1].replace("base64,", "");
var obj = {};
obj.Data = byteData;
obj.Name = fileName;
$.ajax({
type: "POST",
url: "../FileUpload.asmx/UploadFile",
data: '{fileData : ' + JSON.stringify(obj) + ' }',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (r) {
setTimeout(EnviarInformacion(fileName), 20000)
},
error: function (r) {
alert(r.responseText);
},
failure: function (r) {
alert(r.responseText);
}
});
return false;
});
});
Ahora vamos con el código del segundo formulario aquí va el html:
<div class="form-group">
<label for="recipient-name" class="col-form-label">Adjunta tu CV</label>
<input type="file" value="upload" id="FileUpload2" accept="application/pdf" />
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
<button id="btnSave2" type="button" class="Enviar">Enviar</button>
</div>
Código JQuery de mi segundo formulario:
CargaCV2.js
$(function () {
var reader1 = new FileReader();
var fileName1;
$('[id*=FileUpload2]').change(function () {
if (typeof (FileReader) != "undefined") {
var regex = /(.pdf)/;
$($(this)[0].files).each(function () {
var file = $(this);
if (regex.test(file[0].name.toLowerCase())) {
fileName1 = file[0].name;
reader1.readAsDataURL(file[0]);
} else {
alert(file[0].name + " no es un formato de archivo valido.");
return false;
}
});
} else {
alert("This browser does not support HTML5 FileReader.");
}
});
$("[id*=btnSave2]").click(function () {
var byteData = reader1.result;
byteData = byteData.split(';')[1].replace("base64,", "");
var obj = {};
obj.Data = byteData;
obj.Name = fileName1;
$.ajax({
type: "POST",
url: "../FileUpload.asmx/UploadFile",
data: '{fileData : ' + JSON.stringify(obj) + ' }',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (r) {
setTimeout(EnviarInformacionRelacionada(fileName1), 30000)
},
error: function (r) {
alert(r.responseText);
},
failure: function (r) {
alert(r.responseText);
}
});
return false;
});
});
Dándole un poco de seguimiento al mensaje de la consola me lo marca exactamente en la línea 26 del archivo CargaCV.js, lo mas raro es que el error es en el archivo CargaCV.js cuando estoy subiendo el archivo desde el formulario 2 el cual esta haciendo referencia a CargaCV2.js, es como si algo del archivo CargaCV.js estuviera haciendo referencia a las acciones del formulario 2.
Actualización:
Posiblemente esto responda a mi pregunta
Pero aquí no especifica que sea la propiedad split
.
Junto a mi pregunta explico a detalle que son dos formularios que utilizo ambos con funciones iguales con sus respectivos ID
.
Vuelvo y reitero que con el primer formulario no me genera ninguna excepción en consola y con el segundo si me la genera.