{"id":2049,"date":"2023-11-25T15:13:29","date_gmt":"2023-11-25T15:13:29","guid":{"rendered":"http:\/\/194.126.11.162\/?page_id=2049"},"modified":"2024-09-04T05:53:28","modified_gmt":"2024-09-04T05:53:28","slug":"traffic-tickets","status":"publish","type":"page","link":"https:\/\/isf.gov.lb\/ar\/traffic-tickets\/","title":{"rendered":"\u0645\u062e\u0627\u0644\u0641\u0627\u062a \u0633\u0631\u0639\u0629 \u0627\u0644\u0631\u0627\u062f\u0627\u0631"},"content":{"rendered":"\r\n<section class=\"w-100 py-5 bg-cover bg-center bg-repeat-none d-flex align-items-end justify-content-center\" style=\"background-image: linear-gradient(to bottom right, rgba(255, 255, 255, 0.3), rgba(0, 84, 158, 0.3)), url('https:\/\/isf.gov.lb\/wp-content\/uploads\/2024\/09\/4-citizen-services--scaled.jpg');height:40%\">\r\n    <h1 class=\"text-white fw-bold text-xl text-center text-capitalize\">\r\n        \u062e\u062f\u0645\u0627\u062a \u0627\u0644\u0645\u0648\u0627\u0637\u0646\u064a\u0646    <\/h1>\r\n<\/section>\n\n<section id=\"speedTicketSection\" class=\"w-100 pt-5 pb-3 bg-cover bg-center bg-repeat-none bg-light-subtle\" style=\"background-image: url(https:\/\/isf.gov.lb\/wp-content\/themes\/ISF\/resources\/images\/lines_background.png);\">\r\n    <div class=\"d-flex flex-column align-items-center justify-content-center pb-5\">\r\n        <h2 class=\"fw-bold isf-text-primary text-center\">\r\n            \u0645\u062e\u0627\u0644\u0641\u0627\u062a \u0633\u0631\u0639\u0629 \u0627\u0644\u0631\u0627\u062f\u0627\u0631        <\/h2>\r\n        <div class=\"row justify-content-center w-25\">\r\n            <hr class=\"col-1 mt-3 border-3 isf-border-primary opacity-100\" \/>\r\n        <\/div>\r\n    <\/div>\r\n    <div class=\"container mb-3\">\r\n        <div class=\"row justify-content-center px-3\">\r\n            <div class=\"col-lg-6\">\r\n                <div class=\"row g-3\">\r\n                    <div class=\"col-12 col-lg-12\">\r\n                        <input data-field=\"plate_number\" class=\"form-control form-control-lg fs-6 fw-bold rounded-pill bg-white border isf-border-primary\" placeholder=\"\u0631\u0642\u0645 \u0627\u0644\u0622\u0644\u064a\u0629*\" required>\r\n                    <\/div>\r\n                    <div class=\"col-12 col-lg-12\">\r\n                        <select data-field=\"code\" class=\"form-select form-select-lg fs-6 fw-bold rounded-pill bg-white border isf-border-primary\" required>\r\n                            <option selected disabled value=\"\">\r\n                                \u0631\u0645\u0632 \u0627\u0644\u0622\u0644\u064a\u0629*\r\n                            <\/option>\r\n                                                                <option value=\"0\">\r\n                                        A                                    <\/option>\r\n                                                                <option value=\"1\">\r\n                                        \u0628\u062f\u0648\u0646 \u0631\u0645\u0632                                    <\/option>\r\n                                                                <option value=\"2\">\r\n                                        \u0628 &#8211; B                                    <\/option>\r\n                                                                <option value=\"3\">\r\n                                        \u062c &#8211; G                                    <\/option>\r\n                                                                <option value=\"4\">\r\n                                        \u0631 &#8211; R                                    <\/option>\r\n                                                                <option value=\"5\">\r\n                                        \u0632 &#8211; Z                                    <\/option>\r\n                                                                <option value=\"6\">\r\n                                        \u0635 &#8211; S                                    <\/option>\r\n                                                                <option value=\"7\">\r\n                                        \u0637 &#8211; T                                    <\/option>\r\n                                                                <option value=\"8\">\r\n                                        \u0639 &#8211; J                                    <\/option>\r\n                                                                <option value=\"9\">\r\n                                        P                                    <\/option>\r\n                                                                <option value=\"10\">\r\n                                        \u0645 &#8211; M                                    <\/option>\r\n                                                                <option value=\"11\">\r\n                                        \u0646 &#8211; N                                    <\/option>\r\n                                                                <option value=\"12\">\r\n                                        \u0648 &#8211; O                                    <\/option>\r\n                                                                <option value=\"13\">\r\n                                        Y                                    <\/option>\r\n                                                                <option value=\"14\">\r\n                                        \u0642 &#8211; C                                    <\/option>\r\n                                                                <option value=\"19\">\r\n                                        \u0633\u0639\u0648\u062f\u064a\u0629                                    <\/option>\r\n                                                                <option value=\"20\">\r\n                                        \u0642\u0637\u0631\u064a\u0629                                    <\/option>\r\n                                                                <option value=\"22\">\r\n                                        \u062d\u0645\u0635                                    <\/option>\r\n                                                                <option value=\"23\">\r\n                                        \u0627\u062f\u0644\u0628                                    <\/option>\r\n                                                                <option value=\"24\">\r\n                                        \u062f\u0645\u0634\u0642                                    <\/option>\r\n                                                                <option value=\"25\">\r\n                                        \u0627\u0644\u0643\u0648\u064a\u062a                                    <\/option>\r\n                                                                <option value=\"26\">\r\n                                        \u062f\u0628\u064a                                    <\/option>\r\n                                                                <option value=\"27\">\r\n                                        \u0634\u0627\u0631\u0642\u0629                                    <\/option>\r\n                                                                <option value=\"28\">\r\n                                        \u064a\u0648\u0646\u064a\u0641\u064a\u0644                                    <\/option>\r\n                                                                <option value=\"30\">\r\n                                        \u0633\u0648\u064a\u0633\u0631\u0627                                    <\/option>\r\n                                                                <option value=\"31\">\r\n                                        \u062d\u0644\u0628                                    <\/option>\r\n                                                                <option value=\"32\">\r\n                                        \u062d\u0645\u0627\u0629                                    <\/option>\r\n                                                                <option value=\"33\">\r\n                                        \u0627\u0644\u0623\u0631\u062f\u0646                                    <\/option>\r\n                                                                <option value=\"34\">\r\n                                        \u0627\u0628\u0648 \u0638\u0628\u064a                                    <\/option>\r\n                                                                <option value=\"35\">\r\n                                        BLP                                    <\/option>\r\n                                                                <option value=\"36\">\r\n                                        \u0633\u0648\u0631\u064a\u0629                                    <\/option>\r\n                                                                <option value=\"37\">\r\n                                        \u0627\u0644\u0628\u062d\u0631\u064a\u0646                                    <\/option>\r\n                                                                <option value=\"38\">\r\n                                        \u0627\u0644\u0633\u0648\u064a\u062f\u0627\u0621                                    <\/option>\r\n                                                                <option value=\"39\">\r\n                                        \u0627\u0644\u0644\u0627\u0630\u0642\u064a\u0629                                    <\/option>\r\n                                                                <option value=\"40\">\r\n                                        \u0627\u0644\u0625\u0645\u0627\u0631\u0627\u062a                                    <\/option>\r\n                                                                <option value=\"41\">\r\n                                        \u0637\u0631\u0637\u0648\u0633                                    <\/option>\r\n                                                                <option value=\"43\">\r\n                                        \u0627\u0644\u062d\u0633\u0643\u0629                                    <\/option>\r\n                                                                <option value=\"44\">\r\n                                        \u0643\u0627\u0644\u064a\u0641\u0648\u0631\u0646\u064a\u0627                                    <\/option>\r\n                                                                <option value=\"45\">\r\n                                        \u0644\u0648\u062d\u0629 \u0623\u062c\u0646\u0628\u064a\u0629                                    <\/option>\r\n                                                                <option value=\"46\">\r\n                                        \u062f\u064a\u0631 \u0627\u0644\u0632\u0648\u0631                                    <\/option>\r\n                                                                <option value=\"47\">\r\n                                        \u0639\u064f\u0645\u0627\u0646                                    <\/option>\r\n                                                                <option value=\"48\">\r\n                                        \u062a\u062c\u0631\u0628\u0629                                    <\/option>\r\n                                                                <option value=\"49\">\r\n                                        \u062a\u0631\u0643\u064a\u0627                                    <\/option>\r\n                                                                <option value=\"50\">\r\n                                        \u0627\u0644\u0631\u0642\u0629                                    <\/option>\r\n                                                                <option value=\"51\">\r\n                                        \u062f\u0631\u0639\u0627                                    <\/option>\r\n                                                                <option value=\"55\">\r\n                                        \u0627\u0644\u0639\u0631\u0627\u0642                                    <\/option>\r\n                                                                <option value=\"56\">\r\n                                        \u0646\u064a\u062c\u0631\u064a\u0627                                    <\/option>\r\n                                                    <\/select>\r\n                    <\/div>\r\n                <\/div>\r\n                <div class=\"d-flex justify-content-center align-items-center flex-column mt-5\">\r\n                    <button type=\"button\" id=\"submitFormBtn\" onclick=\"submitForm()\" class=\"btn btn-primary fw-bold isf-btn-primary py-2 px-2 border-0 rounded-pill d-flex align-items-center justify-content-between mb-4\">\r\n                        <i class=\"bi bi-chevron-right me-4 opacity-0\"><\/i>\r\n                        \u0628\u062d\u062b                        <i class=\"bi bi-chevron-right ms-4\"><\/i>\r\n                    <\/button>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n        <div class=\"row justify-content-center px-3\">\r\n            <div class=\"col-lg-6 px-3\">\r\n                <div class=\"col\">\r\n                    <div id=\"tableContainer\"><\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n    <div class=\"container\">\r\n\r\n    <\/div>\r\n<\/section>\r\n<script>\r\n    var countValid = 0;\r\n\r\n    function submitForm() {\r\n        $(\"#submitFormBtn\").attr(\"disabled\", true);\r\n        var numOfElements = Array.from($(\"[data-field]\")).length;\r\n\r\n        \/\/ Create FormData object and append data\r\n        var formData = new FormData();\r\n\r\n        $(\"[data-field]\").each((i, field) => {\r\n            var $field = $(field);\r\n            var fieldType = $field.attr(\"data-field\");\r\n            var fieldValue = $field.val().trim();\r\n\r\n            if ($field.attr(\"required\")) {\r\n                if (fieldValue === \"\") {\r\n                    $field.addClass('is-invalid');\r\n                    $(\"#submitFormBtn\").attr(\"disabled\", false);\r\n                } else {\r\n                    $field.removeClass('is-invalid');\r\n                    countValid++;\r\n                    formData.append(field.getAttribute(\"data-field\"), fieldValue);\r\n                }\r\n            } else {\r\n                $field.removeClass('is-invalid');\r\n                countValid++;\r\n                formData.append(field.getAttribute(\"data-field\"), fieldValue);\r\n            }\r\n        });\r\n\r\n        if (countValid < numOfElements) {\r\n            return;\r\n        }\r\n                formData.append(\"_token\", \"@an*LqFi2pdG8rF67EfQ@BE\");\r\n        formData.append(\"lang\", \"ar\")\r\n\r\n        $.ajax({\r\n            type: \"POST\",\r\n            url: \"https:\/\/isf.gov.lb\/api\/service-speed-ticket\",\r\n            data: formData,\r\n            processData: false,\r\n            contentType: false,\r\n            dataType: \"json\",\r\n            success: function(response) {\r\n                console.log(response);\r\n                generateTable(response);\r\n                $(\"#submitFormBtn\").attr(\"disabled\", false);\r\n            },\r\n            error: function(xhr, status, error) {\r\n                console.log(xhr.responseText);\r\n                console.error(error);\r\n            }\r\n        });\r\n    }\r\n\r\n    function generateTable(data) {\r\n        \/\/ Check if data is valid (not undefined or null)\r\n        if (!data || typeof data !== 'object') {\r\n            console.error('Invalid data received:', data);\r\n            return;\r\n        }\r\n\r\n        if (data.length === 0) {\r\n            $(\"#tableContainer\").html(\r\n                `\r\n                <div class=\"alert alert-light isf-text-primary text-center fw-bold fs-5\" role=\"alert\">\r\n                    \u0644\u0627 \u064a\u0648\u062c\u062f \u0646\u062a\u0627\u0626\u062c                <\/div>\r\n                `\r\n            )\r\n            return;\r\n        }\r\n\r\n        const table = document.createElement('table');\r\n        table.classList.add('table', 'table-bordered', 'table-fixed', 'table-responsive', 'm-0', 'text-center');\r\n        table.style.tableLayout = 'fixed';\r\n        \/\/ Create table headers with Bootstrap classes\r\n        const headers = Object.keys(data[0]);\r\n        const header = document.createElement('thead');\r\n        header.classList.add('table-light');\r\n        const headerRow = document.createElement('tr');\r\n        [\"\u062a\u0627\u0631\u064a\u062e \u0627\u0644\u0645\u062e\u0627\u0644\u0641\u0629\", \"\u0627\u0644\u0645\u0641\u0631\u0632\u0629\"].forEach((header) => {\r\n            const th = document.createElement('th');\r\n            th.classList.add('isf-text-primary');\r\n            th.textContent = header;\r\n            headerRow.appendChild(th);\r\n        });\r\n        header.appendChild(headerRow);\r\n        table.appendChild(header);\r\n\r\n        const body = document.createElement('tbody');\r\n        \/\/ Create table rows with data and Bootstrap classes\r\n        data.forEach((row) => {\r\n            const dataRow = document.createElement('tr');\r\n            headers.forEach((header) => {\r\n                const td = document.createElement('td');\r\n                td.classList.add('custom-td');\r\n                td.textContent = row[header];\r\n                dataRow.appendChild(td);\r\n            });\r\n            body.appendChild(dataRow);\r\n        });\r\n        table.appendChild(body);\r\n\r\n        \/\/ Wrap the table in a container-fluid for full width\r\n        const tableWrapper = document.createElement('div');\r\n        tableWrapper.classList.add('table-responsive');\r\n\r\n        \/\/ Append the table to the container\r\n        tableWrapper.appendChild(table);\r\n        document.getElementById('tableContainer').innerHTML = ''; \/\/ Empty the container before appending the table\r\n        document.getElementById('tableContainer').appendChild(tableWrapper);\r\n    }\r\n<\/script>","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"blocks-pages.php","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"class_list":["post-2049","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/isf.gov.lb\/ar\/wp-json\/wp\/v2\/pages\/2049","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/isf.gov.lb\/ar\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/isf.gov.lb\/ar\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/isf.gov.lb\/ar\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/isf.gov.lb\/ar\/wp-json\/wp\/v2\/comments?post=2049"}],"version-history":[{"count":10,"href":"https:\/\/isf.gov.lb\/ar\/wp-json\/wp\/v2\/pages\/2049\/revisions"}],"predecessor-version":[{"id":7678,"href":"https:\/\/isf.gov.lb\/ar\/wp-json\/wp\/v2\/pages\/2049\/revisions\/7678"}],"wp:attachment":[{"href":"https:\/\/isf.gov.lb\/ar\/wp-json\/wp\/v2\/media?parent=2049"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}