Question

我正在编写一个简单的Web应用程序作为工作的验证工具。基本上它验证了一堆输入，并在发现某些陷阱时阻止代理继续。如果一切看起来都正确，它会做一些简单的数学运算并创建一个“收据”，说明他们在批准收费之前已经过验证，并将收据粘贴到我们的内部数据库中。

我已经完成了所有工作，但老实说我不知道如何只在需要时才能显示收据的某些行。以下是部分的片段，可以给你一个想法：

HTML

<div class="md-form form-row">
    <div class="form-group col-xs-4 col-md-4">
        <label for="totalEstimate">Total Estimate: </label>
        <input id="totalEstimate" class="form-control form-control-sm" type="number" min="0.01" step="0.01" max="100000"  placeholder="$0.00..." required readonly>
    </div>
    <div class="form-group col-xs-4 col-md-4">
        <label for="remainingLOL">LOL After Repairs:   </label>
        <input id="remainingLOL" class="form-control form-control-sm" type="number" min="0.01" step="0.01" max="100000"  placeholder="$0.00...">
        <p id="remainingLOLVal"></p>
    </div>
    <div class="form-group col-xs-4 col-md-4">
        <label for="diagOnly">Attempted/Diag:  </label>
        <input id="diagOnly" class="form-control form-control-sm" type="number" min="0.01" step="0.01" max="100000"  placeholder="$0.00..." disabled>
    </div>
</div>

<div class="form-row">
    <div id="ppcDIAG" class="form group col-xs-2 col-md-2"><label>  </label>
    </div>
    <div class="form-control">
        <label for="estApproved">Estimate Disposition </label>
        <select id="estApproved" class="custom-select" required>
            <option value="APPROVED">APPROVED</option>
            <option value="DENIED">DENIED</option>
            <option value="PENDING">PENDING</option>
        </select>
    </div>
</div>

的Javascript

// Function to enable the input #diagOnly if denying or pending
$(document).ready(function () {
$('#estApproved').change(function() {
  if ( $('#estApproved').val() == "APPROVED") {
    $('#diagOnly').prop( "disabled", true );
  } else {
    $('#diagOnly').prop( "disabled", false );
    $('#diagOnly').prop( "required", true );
  } 
});
});


// The generated receipt that the agent will be pasting into in house database
function formReceiptTemplate() {
  $('#formReceipt').val(
    '\nTotal Estimate: $' + $('#totalEstimate').val()
    +'\n___________________________'
    +'\nEstimate: ' + $('#estApproved').val()
    +'\nAttempted Repair or Diagnostic Only Fees: ' + $('#diagOnly').val()
    +'\nPre-Approval Code: '
    +'\n'
    +'\n"As a reminder, all pre-approvals are contingent upon verification of your contracted or agreed upon service rates. Contracted rates supersede preliminary estimates and approvals".'
    +'\n '
    +'\n '    
  );

对于这个例子，我希望“#diagOnly”输入只有在选择“pending”或“denied”并且我想要整行时才能激活：

+'\nAttempted Repair or Diagnostic Only Fees: ' + $('#diagOnly').val()

在最终收据中遗失，因为它应该仅在未经“批准”时适用。我已经搜索了所有可能的内容，但是我现在只编写了大约一个月的Javascript，这是需要这个工具的结果。不确定在哪里看。

道歉，如果这是超级容易或重复。在创建帐户之前我确实看过了。如果你至少能指出我在哪里研究的正确方向，我会很乐意继续在那里。真的很期待学习更多！

Answer 1

“最简单”的答案，只需逐段构建字符串，并使用if语句检查选择框的状态：

function formReceiptTemplate() {
    var receipt = '\nTotal Estimate: $' + $('#totalEstimate').val()
        +'\n___________________________'
        +'\nEstimate: ' + $('#estApproved').val();

    if ($('#estApproved').val() !== 'APPROVED') {
        // X += Y is equivalent to x = x + y
        receipt += '\nAttempted Repair or Diagnostic Only Fees: ' + $('#diagOnly').val();
    }

    receipt += '\nPre-Approval Code: '
        +'\n'
        +'\n"As a reminder, all pre-approvals are contingent upon verification of your contracted or agreed upon service rates. Contracted rates supersede preliminary estimates and approvals".'
        +'\n '
        +'\n ';

    $('#formReceipt').val(receipt);
}

更清洁的解决方案是使用模板库，以便您可以避免所有这些疯狂的字符串连接。此外，通过将JQuery元素存储为变量可以提高效率，因此您无需反复查看它们。

根据选择选项从JS输出中删除文本

1 个答案: