1

Есть функция (showHistory), на которую прилетает параметр из другой функции (searchByName). Вылетает ошибка Uncaught ReferenceError: $ is not defined. Я понимаю, что ругается на отсутствие переменной = $ (наверное). Но моих поверхностных знаний JavaScript не хватает, чтобы исправить ошибку. Застрял. Все остальное плюс-минус функционирует. Как заставить работать?

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <style>
        table {
            font-family: arial, sans-serif;
            border-collapse: collapse;
            width: 100%;
        }

        td, th {
            border: 1px solid #dddddd;
            text-align: left;
            padding: 8px;
        }

        tr:nth-child(even) {
            background-color: #dddddd;
        }
    </style>
    <title></title>
</head>
<body>

<h2>MOEX awkward application tool</h2>

<table id="securityList"></table>

<form action="#">
    <input id="security_id" placeholder="Id">
    <input id="security_secId" placeholder="SecId">
    <input id="security_shortName" placeholder="ShortName">
    <input id="security_secName" placeholder="Name">
    <button onclick="createSecurity()">Create security</button>

</form>

<label for="search_field"></label><input id="search_field" placeholder="Enter company name">
<button onclick="searchByName()">Search</button>


<button onclick="loadSecurity()">Load all securities</button>

<script>
    function searchByName() {
        var name = document.getElementById("search_field").value;
        var httpRequest = new XMLHttpRequest();
        httpRequest.onreadystatechange = function () {
            if (this.readyState === 4 && this.status === 200) {
                var securities = JSON.parse(this.responseText);
                let html = '<tr>\n' +
                    '        <th>Id</th>\n' +
                    '        <th>SECID</th>\n' +
                    '        <th>Short Name</th>\n' +
                    '        <th>RegNumber</th>\n' +
                    '        <th>Name</th>\n' +
                    '        <th>IsIn</th>\n' +
                    '        <th>Is Traded</th>\n' +
                    '        <th>Emitent Id</th>\n' +
                    '        <th>Emitent Title</th>\n' +
                    '        <th>Emitent Inn</th>\n' +
                    '        <th>Emitent Okpo</th>\n' +
                    '        <th>GosReg</th>\n' +
                    '        <th>Type</th>\n' +
                    '        <th>Group</th>\n' +
                    '        <th>Primary Board Id</th>\n' +
                    '        <th>Market Price Board Id</th>\n' +
                    '        <th>Show history</th>\n' +
                    '        <th>Delete</th>\n' +
                    '    </tr>';
                for (var i = 0; i < securities.length; i++) {
                    var security = securities[i];
                    console.log(security);
                    html = html + '<tr><td>' + security.id + '</td>\n' +
                        '        <td>' + security.secId + '</td>\n' +
                        '        <td>' + security.shortName + '</td>\n' +
                        '        <th>' + security.regNumber + '</td>\n' +
                        '        <td>' + security.secName + '</td>\n' +
                        '        <td>' + security.isIn + '</td>\n' +
                        '        <td>' + security.isTraded + '</td>\n' +
                        '        <td>' + security.emitentId + '</tdh>\n' +
                        '        <td>' + security.emitentTitle + '</td>\n' +
                        '        <td>' + security.emitentInn + '</td>\n' +
                        '        <td>' + security.emitentOkpo + '</td>\n' +
                        '        <td>' + security.gosReg + '</td>\n' +
                        '        <td>' + security.secType + '</td>\n' +
                        '        <td>' + security.secGroup + '</td>\n' +
                        '        <td>' + security.primaryBoardId + '</td>\n' +
                        '        <td>' + security.marketPriceBoardId + '</td>\n' +
                        '        <td><button onclick="showHistory(' + security.secId + ')">Show History</button></td>' +
                        '        <td><button onclick="deleteSecurity(' + security.id + ')">Delete</button></td></tr>';
                }
                document.getElementById("securityList").innerHTML = html;
            }
        };
        httpRequest.open("GET", "http://localhost:8090/controller/security/findByName?name=" + name, true);
        httpRequest.send();
    }

    function deleteSecurity(securityId) {
        var httpRequest = new XMLHttpRequest();
        httpRequest.open("DELETE", "http://localhost:8090/controller/security/delete/" + securityId, true);
        httpRequest.send();
    }

    function createSecurity() {
        var id = document.getElementById("security_id").value;
        var secId = document.getElementById("security_secId").value;
        var shortName = document.getElementById("security_shortName").value;
        var secName = document.getElementById("security_secName").value;

        var xmlhttp = new XMLHttpRequest();   // new HttpRequest instance
        xmlhttp.open("POST", "http://localhost:8090/controller/security/save");
        xmlhttp.setRequestHeader("Content-Type", "application/json;charset=utf-8");
        xmlhttp.send(JSON.stringify({id: id, secId: secId, shortName: shortName, name: secName}));
    }

    function loadSecurity() {
        var httpRequest = new XMLHttpRequest();
        httpRequest.onreadystatechange = function () {
            if (this.readyState === 4 && this.status === 200) {
                var securities = JSON.parse(this.responseText);
                var html = '<tr>\n' +
                    '        <th>Id</th>\n' +
                    '        <th>secId</th>\n' +
                    '        <th>regNumber</th>\n' +
                    '        <th>name</th>\n' +
                    '        <th>emitentTitle</th>\n' +
                    '        <th>Show history</th>\n' +
                    '        <th>Delete</th>\n' +
                    '    </tr>';
                for (var i = 0; i < securities.length; i++) {
                    var security = securities[i];
                    console.log(security);
                    html = html + '<tr><td>' + security.id + '</td>\n' +
                        '        <td>' + security.secId + '</td>\n' +
                        '        <td>' + security.regNumber + '</td>\n' +
                        '        <td>' + security.name + '</td>\n' +
                        '        <td>' + security.emitentTitle + '</td>\n' +
                        '        <td><button onclick="showHistory(' + security.secId + ')">Show History</button></td>' +
                        '        <td><button onclick="deleteSecurity(' + security.id + ')">Delete</button></td></tr>';

                }
                document.getElementById("securityList").innerHTML = html;
            }
        };
        httpRequest.open("GET", "http://localhost:8090/controller/security/findAll", true);
        httpRequest.send();
    }

    function showHistory(secHisId) {
        var httpRequest = new XMLHttpRequest();
        httpRequest.onreadystatechange = function () {
            if (this.readyState === 4 && this.status === 200) {
                var histories = JSON.parse(this.responseText);
                let html = '<tr>\n' +
                    '        <th>Id</th>\n' +
                    '        <th>boardid</th>\n' +
                    '        <th>tradedate</th>\n' +
                    '        <th>shortname</th>\n' +
                    '        <th>secid</th>\n' +
                    '        <th>numtrades</th>\n' +
                    '        <th>value</th>\n' +
                    '        <th>open</th>\n' +
                    '        <th>low Title</th>\n' +
                    '        <th>high</th>\n' +
                    '        <th>legalcloseprice</th>\n' +
                    '        <th>waprice</th>\n' +
                    '        <th>close</th>\n' +
                    '        <th>volume</th>\n' +
                    '        <th>marketprice2</th>\n' +
                    '        <th>marketprice3</th>\n' +
                    '        <th>admittedquote</th>\n' +
                    '        <th>marketprice3tradesvalue</th>\n' +
                    '        <th>admittedvalue</th>\n' +
                    '        <th>Delete</th>\n' +
                    '    </tr>';
                for (var i = 0; i < histories.length; i++) {
                    var history = histories[i];
                    console.log(history);
                    html = html + '<tr><td>' + security.hisId + '</td>\n' +
                        '        <td>' + history.boardId + '</td>\n' +
                        '        <td>' + history.tradeDate + '</td>\n' +
                        '        <th>' + history.shortHistoryName + '</td>\n' +
                        '        <td>' + history.secHisId + '</td>\n' +
                        '        <td>' + history.numTrades + '</td>\n' +
                        '        <td>' + history.valueHis + '</td>\n' +
                        '        <td>' + history.hisOpen + '</tdh>\n' +
                        '        <td>' + history.lowHis + '</td>\n' +
                        '        <td>' + history.highHis + '</td>\n' +
                        '        <td>' + history.legalClosePrice + '</td>\n' +
                        '        <td>' + history.waPrice + '</td>\n' +
                        '        <td>' + history.closeHis + '</td>\n' +
                        '        <td>' + history.volumeHis + '</td>\n' +
                        '        <td>' + history.marketPrice2 + '</td>\n' +
                        '        <td>' + history.marketPrice3 + '</td>\n' +
                        '        <td>' + history.admittedQuote + '</td>\n' +
                        '        <td>' + history.marketPrice3TradesValue + '</td>\n' +
                        '        <td>' + history.admittedValue + '</td>\n' +
                        '        <td><button onclick="deleteSecurity(' + history.id + ')">Delete</button></td></tr>';
                }
                document.getElementById("securityList").innerHTML = html;
            }
        };
        httpRequest.open("GET", "http://localhost:8090/controller/history/findBySecHisId?secHisId=" + secHisId, true);
        httpRequest.send();
    }
</script>
</body>
</html>

2
  • В приведенном коде такой ошибки быть не может, потому что $ нигде не используется Commented 18 сент. 2020 в 11:04
  • Под $ я имею в виду значение, которое должно приходить к функции при нажатии кнопки "Show history". Нажимая ее на строке, где secId равен AAAA, я получаю Uncaught ReferenceError: AAAA is not defined, аналогично с другими строками в сгенерированной таблице.
    – Borkau
    Commented 18 сент. 2020 в 11:08

1 ответ 1

3

Вы в функцию передаете строковое значение. А строки должны обрамляться кавычками

'   <td><button onclick="showHistory(\'' + security.secId + '\')">Show History</button></td>' +
                                     ^^                      ^^

Тогда на странице у вас вместо

<td><button onclick="showHistory(AAA)">Show History</button></td>

окажется

<td><button onclick="showHistory('AAA')">Show History</button></td>
1
  • Заработало, спасибо!
    – Borkau
    Commented 18 сент. 2020 в 11:51

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.