Как экспортировать данные формы в excel/csv, когда мы нажимаем на кнопку Отправить
Привет всем, я новичок в мире программирования и нуждаюсь в помощи, у меня есть страница формы, которая создана из какой-то третьей части, это простая страница, которая принимает детали и сохраняет данные в google spread sheets, но в соответствии со стандартами компании она отправляет электронные письма от стороннего хостера, который имеет все конфиденциальные данные, а также сохранение в google spread sheets не является хорошей идеей. можете ли вы помочь мне здесь, мне нужно отредактировать форму таким образом, чтобы она сохраняла данные локально в формате .csv или excel, а также электронная почта должна быть доставлена локально. есть ли какой-нибудь способ сделать это? ниже приведен код.
<script src="https://cdn.jotfor.ms/static/prototype.forms.js" type="text/javascript"></script>
<script src="https://cdn.jotfor.ms/static/jotform.forms.js?3.3.5306" type="text/javascript"></script>
<script type="text/javascript">
JotForm.init(function(){
JotForm.alterTexts(undefined);
JotForm.clearFieldOnHide="disable";
FormTranslation.init({"detectUserLanguage":"1","firstPageOnly":"0","options":"English (US)","originalLanguage":"en","primaryLanguage":"en","saveUserLanguage":"1","showStatus":"flag-with-nation","theme":"light-theme","version":"2"});
JotForm.submitError="jumpToFirstError";
/*INIT-END*/
});
JotForm.prepareCalculationsOnTheFly([null,{"name":"Pts","qid":"1","text":" PTS Tracker","type":"control_head"},{"name":"submit2","qid":"2","text":"Submit","type":"control_button"},null,{"description":"","name":"email","qid":"4","subLabel":"example@deloitte.com","text":"Email","type":"control_email"},{"description":"","name":"employeeId5","qid":"5","subLabel":"","text":"Employee Id","type":"control_textbox"},{"description":"","name":"description","qid":"6","subLabel":"","text":"Description","type":"control_textarea"},null,{"description":"","name":"ticketNo8","qid":"8","subLabel":"","text":"Ticket No ","type":"control_textbox"},{"description":"","name":"techEmail","qid":"9","subLabel":"example@deloitte.com","text":"Tech Email Id","type":"control_email"},{"description":"","name":"peripheral","qid":"10","text":"Peripheral","type":"control_checkbox"},{"description":"","name":"typeOf","qid":"11","text":"Type of request","type":"control_checkbox"}]);
setTimeout(function() {
JotForm.paymentExtrasOnTheFly([null,{"name":"Pts","qid":"1","text":" PTS Tracker","type":"control_head"},{"name":"submit2","qid":"2","text":"Submit","type":"control_button"},null,{"description":"","name":"email","qid":"4","subLabel":"example@deloitte.com","text":"Email","type":"control_email"},{"description":"","name":"employeeId5","qid":"5","subLabel":"","text":"Employee Id","type":"control_textbox"},{"description":"","name":"description","qid":"6","subLabel":"","text":"Description","type":"control_textarea"},null,{"description":"","name":"ticketNo8","qid":"8","subLabel":"","text":"Ticket No ","type":"control_textbox"},{"description":"","name":"techEmail","qid":"9","subLabel":"example@deloitte.com","text":"Tech Email Id","type":"control_email"},{"description":"","name":"peripheral","qid":"10","text":"Peripheral","type":"control_checkbox"},{"description":"","name":"typeOf","qid":"11","text":"Type of request","type":"control_checkbox"}]);}, 20);
</script>
<link href="https://cdn.jotfor.ms/static/formCss.css?3.3.5306" rel="stylesheet" type="text/css" />
<link type="text/css" media="print" rel="stylesheet" href="https://cdn.jotfor.ms/css/printForm.css?3.3.5306" />
<link type="text/css" rel="stylesheet" href="https://cdn.jotfor.ms/css/styles/nova.css?3.3.5306" />
<link type="text/css" rel="stylesheet" href="https://cdn.jotfor.ms/themes/CSS/5495102b700cc419478b4567.css?themeRevisionID=58d1cab53bf21c58d76dec92"/>
<style type="text/css">
.form-label-left{
width:150px;
}
.form-line{
padding-top:12px;
padding-bottom:12px;
}
.form-label-right{
width:150px;
}
.form-all{
width:550px;
color:rgb(255, 255, 255) !important;
font-family:'Exo 2';
font-size:16px;
}
</style>
<style type="text/css" id="form-designer-style">
/* Injected CSS Code */
/*PREFERENCES STYLE*/
.form-all {
font-family: Exo 2, sans-serif;
}
.form-all .qq-upload-button,
.form-all .form-submit-button,
.form-all .form-submit-reset,
.form-all .form-submit-print {
font-family: Exo 2, sans-serif;
}
.form-all .form-pagebreak-back-container,
.form-all .form-pagebreak-next-container {
font-family: Exo 2, sans-serif;
}
.form-header-group {
font-family: Exo 2, sans-serif;
}
.form-label {
font-family: Exo 2, sans-serif;
}
.form-label.form-label-auto {
display: inline-block;
float: left;
text-align: left;
}
.form-line {
margin-top: 12px;
margin-bottom: 12px;
}
.form-all {
width: 550px;
}
.form-label-left,
.form-label-right,
.form-label-left.form-label-auto,
.form-label-right.form-label-auto {
width: 150px;
}
.form-all {
font-size: 16px
}
.form-all .qq-upload-button,
.form-all .qq-upload-button,
.form-all .form-submit-button,
.form-all .form-submit-reset,
.form-all .form-submit-print {
font-size: 16px
}
.form-all .form-pagebreak-back-container,
.form-all .form-pagebreak-next-container {
font-size: 16px
}
.supernova .form-all, .form-all {
background-color: rgba(0, 0, 0, 0.83);
border: 1px solid transparent;
}
.form-all {
color: rgb(255, 255, 255);
}
.form-header-group .form-header {
color: rgb(255, 255, 255);
}
.form-header-group .form-subHeader {
color: rgb(255, 255, 255);
}
.form-label-top,
.form-label-left,
.form-label-right,
.form-html,
.form-checkbox-item label,
.form-radio-item label {
color: rgb(255, 255, 255);
}
.form-sub-label {
color: 1a1a1a;
}
.supernova {
background-color: rgb(255, 255, 255);
}
.supernova body {
background: transparent;
}
.form-textbox,
.form-textarea,
.form-radio-other-input,
.form-checkbox-other-input,
.form-captcha input,
.form-spinner input {
background-color: rgba(255, 255, 255, 0.72);
}
.supernova {
height: 100%;
background-repeat: repeat;
background-attachment: scroll;
background-position: center top;
}
.supernova {
background-image: url("//www.jotform.com/uploads/EltonCris/form_files/photo-1415639636295-61ae91a98b39.jpg");
}
#stage {
background-image: url("//www.jotform.com/uploads/EltonCris/form_files/photo-1415639636295-61ae91a98b39.jpg");
}
.form-all {
background-image: url("https://www.jotform.com/uploads/egeg/form_files/style4_2_bg.gif");
background-repeat: repeat;
background-attachment: scroll;
background-position: center top;
}
.form-all {
position: relative;
}
.form-all:before {
content: "";
background-image: url("https://www.jotform.com/uploads/santoshlepak/form_files/1.5ab6729febc712.62856624.PNG");
display: inline-block;
height: 111px;
position: absolute;
background-size: 550px 111px;
background-repeat: no-repeat;
width: 100%;
}
.form-all {
margin-top: 121px !important;
}
.form-all:before {
top: -121px;
left: 0;
background-position: top left;
}
.ie-8 .form-all:before { display: none; }
.ie-8 {
margin-top: auto;
margin-top: initial;
}
/*PREFERENCES STYLE*//*__INSPECT_SEPERATOR__*/
/* Injected CSS Code */
</style>
<form class="jotform-form" action="https://submit.jotform.me/submit/80841627962464/" method="post" name="form_80841627962464" id="80841627962464" accept-charset="utf-8">
<input type="hidden" name="formID" value="80841627962464" />
<div class="form-all">
<link type="text/css" rel="stylesheet" media="all" href="https://cdn.jotfor.ms/wizards/languageWizard/custom-dropdown/css/lang-dd.css?3.3.5306" />
<div class="cont">
<input type="text" id="input_language" name="input_language" style="display:none" />
<div class="language-dd" id="langDd" style="display:none">
<div class="dd-placeholder lang-emp">
Language
</div>
<ul class="lang-list dn" id="langList">
<li data-lang="en" class="en">
English (US)
</li>
</ul>
</div>
</div>
<script type="text/javascript" src="https://cdn.jotfor.ms/js/formTranslation.v2.js?3.3.5306"></script>
<ul class="form-section page-section">
<li id="cid_1" class="form-input-wide" data-type="control_head">
<div class="form-header-group ">
<div class="header-text httac htvam">
<h1 id="header_1" class="form-header" data-component="header">
PTS Tracker
</h1>
</div>
</div>
</li>
<li class="form-line jf-required" data-type="control_email" id="id_4">
<label class="form-label form-label-left form-label-auto" id="label_4" for="input_4">
Email
<span class="form-required">
*
</span>
</label>
<div id="cid_4" class="form-input jf-required">
<span class="form-sub-label-container" style="vertical-align:top;">
<input type="email" id="input_4" name="q4_email" class="form-textbox validate[required, Email]" size="30" value="" data-component="email" required="" />
<label class="form-sub-label" for="input_4" style="min-height:13px;"> example@deloitte.com </label>
</span>
</div>
</li>
<li class="form-line jf-required" data-type="control_textbox" id="id_5">
<label class="form-label form-label-left form-label-auto" id="label_5" for="input_5">
Employee Id
<span class="form-required">
*
</span>
</label>
<div id="cid_5" class="form-input jf-required">
<input type="text" id="input_5" name="q5_employeeId5" data-type="input-textbox" class="form-textbox validate[required]" size="20" value="" data-component="textbox" required="" />
</div>
</li>
<li class="form-line jf-required" data-type="control_textbox" id="id_8">
<label class="form-label form-label-left form-label-auto" id="label_8" for="input_8">
Ticket No
<span class="form-required">
*
</span>
</label>
<div id="cid_8" class="form-input jf-required">
<input type="text" id="input_8" name="q8_ticketNo8" data-type="input-textbox" class="form-textbox validate[required]" size="20" value="" data-component="textbox" required="" />
</div>
</li>
<li class="form-line" data-type="control_textarea" id="id_6">
<label class="form-label form-label-left form-label-auto" id="label_6" for="input_6"> Description </label>
<div id="cid_6" class="form-input">
<textarea id="input_6" class="form-textarea" name="q6_description" cols="40" rows="6" data-component="textarea"></textarea>
</div>
</li>
<li class="form-line jf-required" data-type="control_email" id="id_9">
<label class="form-label form-label-left form-label-auto" id="label_9" for="input_9">
Tech Email Id
<span class="form-required">
*
</span>
</label>
<div id="cid_9" class="form-input jf-required">
<span class="form-sub-label-container" style="vertical-align:top;">
<input type="email" id="input_9" name="q9_techEmail" class="form-textbox validate[required, Email]" size="30" value="" data-component="email" required="" />
<label class="form-sub-label" for="input_9" style="min-height:13px;"> example@deloitte.com </label>
</span>
</div>
</li>
<li class="form-line jf-required" data-type="control_checkbox" id="id_10">
<label class="form-label form-label-left form-label-auto" id="label_10" for="input_10_0">
Peripheral
<span class="form-required">
*
</span>
</label>
<div id="cid_10" class="form-input jf-required">
<div class="form-single-column" data-component="checkbox">
<span class="form-checkbox-item" style="clear:left;">
<span class="dragger-item">
</span>
<input type="checkbox" class="form-checkbox validate[required]" id="input_10_0" name="q10_peripheral[]" value="Headset" required="" />
<label id="label_input_10_0" for="input_10_0"> Headset </label>
</span>
<span class="form-checkbox-item" style="clear:left;">
<span class="dragger-item">
</span>
<input type="checkbox" class="form-checkbox validate[required]" id="input_10_1" name="q10_peripheral[]" value="Mouse" required="" />
<label id="label_input_10_1" for="input_10_1"> Mouse </label>
</span>
<span class="form-checkbox-item" style="clear:left;">
<span class="dragger-item">
</span>
<input type="checkbox" class="form-checkbox validate[required]" id="input_10_2" name="q10_peripheral[]" value="Adapter" required="" />
<label id="label_input_10_2" for="input_10_2"> Adapter </label>
</span>
<span class="form-checkbox-item" style="clear:left;">
<span class="dragger-item">
</span>
<input type="checkbox" class="form-checkbox validate[required]" id="input_10_3" name="q10_peripheral[]" value="Privacy Screen" required="" />
<label id="label_input_10_3" for="input_10_3"> Privacy Screen </label>
</span>
<span class="form-checkbox-item" style="clear:left;">
<span class="dragger-item">
</span>
<input type="checkbox" class="form-checkbox validate[required]" id="input_10_4" name="q10_peripheral[]" value="Hdmi to VGA" required="" />
<label id="label_input_10_4" for="input_10_4"> Hdmi to VGA </label>
</span>
<span class="form-checkbox-item" style="clear:left;">
<span class="dragger-item">
</span>
<input type="checkbox" class="form-checkbox validate[required]" id="input_10_5" name="q10_peripheral[]" value="Mini Dp to VGA" required="" />
<label id="label_input_10_5" for="input_10_5"> Mini Dp to VGA </label>
</span>
<span class="form-checkbox-item" style="clear:left;">
<span class="dragger-item">
</span>
<input type="checkbox" class="form-checkbox validate[required]" id="input_10_6" name="q10_peripheral[]" value="Bag" required="" />
<label id="label_input_10_6" for="input_10_6"> Bag </label>
</span>
<span class="form-checkbox-item" style="clear:left;">
<label style="display:none;" for="other_10"> Other option </label>
<input type="checkbox" class="form-checkbox-other form-checkbox validate[required]" name="q10_peripheral[other]" id="other_10" value="other" />
<input type="text" class="form-checkbox-other-input form-textbox" name="q10_peripheral[other]" data-otherhint="Other" placeholder="Other" size="15" id="input_10" />
<br/>
</span>
</div>
</div>
</li>
<li class="form-line jf-required" data-type="control_checkbox" id="id_11">
<label class="form-label form-label-left form-label-auto" id="label_11" for="input_11_0">
Type of request
<span class="form-required">
*
</span>
</label>
<div id="cid_11" class="form-input jf-required">
<div class="form-multiple-column" data-columncount="4" data-component="checkbox">
<span class="form-checkbox-item">
<span class="dragger-item">
</span>
<input type="checkbox" class="form-checkbox validate[required]" id="input_11_0" name="q11_typeOf[]" value="Issue" required="" />
<label id="label_input_11_0" for="input_11_0"> Issue </label>
</span>
<span class="form-checkbox-item">
<span class="dragger-item">
</span>
<input type="checkbox" class="form-checkbox validate[required]" id="input_11_1" name="q11_typeOf[]" value="Replace" required="" />
<label id="label_input_11_1" for="input_11_1"> Replace </label>
</span>
<span class="form-checkbox-item">
<span class="dragger-item">
</span>
<input type="checkbox" class="form-checkbox validate[required]" id="input_11_2" name="q11_typeOf[]" value="Lost" required="" />
<label id="label_input_11_2" for="input_11_2"> Lost </label>
</span>
<span class="form-checkbox-item">
<span class="dragger-item">
</span>
<input type="checkbox" class="form-checkbox validate[required]" id="input_11_3" name="q11_typeOf[]" value="Loaner" required="" />
<label id="label_input_11_3" for="input_11_3"> Loaner </label>
</span>
</div>
</div>
</li>
<li class="form-line" data-type="control_button" id="id_2">
<div id="cid_2" class="form-input-wide">
<div style="text-align:center;" class="form-buttons-wrapper">
<button id="input_2" type="submit" class="form-submit-button" data-component="button">
Submit
</button>
<span>
</span>
<button id="input_reset_2" type="reset" class="form-submit-reset" data-component="button">
Clear Form
</button>
</div>
</div>
</li>
<li style="display:none">
Should be Empty:
<input type="text" name="website" value="" />
</li>
</ul>
</div>
<script>
JotForm.showJotFormPowered = "new_footer";
</script>
<input type="hidden" id="simple_spc" name="simple_spc" value="80841627962464" />
<script type="text/javascript">
document.getElementById("si" + "mple" + "_spc").value = "80841627962464-80841627962464";
</script>
<div class="formFooter-heightMask">
</div>
<div class="formFooter">
<a href="https://www.jotform.com/?utm_source=formfooter&utm_medium=banner&utm_term=80841627962464&utm_content=jotform_logo&utm_campaign=powered_by_jotform_test_old_le" target="_blank" class="formFooter-logoLink"><img class="formFooter-logo" src="https://cdn.jotfor.ms/assets/img/logo/logo-new@1x.png" alt="" style="height: 44px;"></a>
<div class="formFooter-rightSide">
<span class="formFooter-text">
Now create your own JotForm - It's free!
</span>
<a class="formFooter-button" href="https://www.jotform.com/?utm_source=formfooter&utm_medium=banner&utm_term=80841627962464&utm_content=jotform_button&utm_campaign=powered_by_jotform_test_old_le" target="_blank">Create your own JotForm</a>
</div>
</div>
</form>
<script type="text/javascript">JotForm.ownerView=true;</script>
Что я уже пробовал:
Я пробовал использовать jotforms, который помогает нам создавать формы, но он сохраняет данные в google spread sheets, а также отправляет электронную почту из jotforms, в которой есть все данные от компании, так что это будет риск от фирменного стандарта. поэтому мне нужно изменить его, например, сохранить файл .csv/excel локально и отправить электронную почту локально
Richard MacCutchan
Это хороший пример того, почему вы никогда не должны копировать код из интернета, Если вы действительно не понимаете его.
Member 11473336
Привет, Ричард, спасибо за ответ, я новичок в мире программирования, поэтому просто попробовал. если вы знаете процесс и как это сделать, дайте мне знать.
Richard MacCutchan
Извините, я понятия не имею, что этот код должен делать или что он делает неправильно. И если вы новичок в программировании, то это действительно не тот проект, который компания должна вам предложить.
Я вижу, что вы являетесь членом клуба уже более трех лет, так насколько же вы новенький?