const elSearchForm = document.querySelector(".js-search-form")

Download 3,3 Mb.
bet	14/14
Sana	17.05.2024
Hajmi	3,3 Mb.
	#240846

1 ... 6 7 8 9 10 11 12 13 14

Bog'liq
1685984092 (1)

const elSearchForm = document.querySelector(".js-search-form");
const productsInput = document.querySelector(".js-input");

const elTable = document.querySelector(".js-table");

const tableName = document.querySelector(".js-add");
const tableNumber = document.querySelector(".js-number");
const tableTime= document.querySelector(".js-price");

function renderProducts(products) {
tableName.innerHTML = "";
tableNumber.innerHTML = "";
tableTime.innerHTML = "";
products.forEach((product) => {
tableName.textContent = product.name,
tableNumber.textContent = product.number,
tableTime.textContent = product.time
});
}

function showSearchResults(regexp) {
const filteredProducts = products.filter(
(product) =>
String(product.id).match(regexp)
);
return filteredProducts;
}

elSearchForm.addEventListener("submit", function(evt){
evt.preventDefault();

const inputValue = productsInput.value;
const searchProducts = showSearchResults(inputValue);

console.log(searchProducts);
if(searchProducts.length != 0){
renderProducts(searchProducts);
}else{
alert("Kechirasiz, bunday Id raqamdagi mahsulot mavjud emas!");
}

productsInput.value = "";
});
HTML kodlari.
DOCTYPE html>

Bojxona <a href="/mehnat-muhofazasi-v2.html">Nazorati</a>

BOJXONA NAZORATI!

Bizning barcha xizmatlarimiz tegishli idoralar tomonidan litsenziyalangan va biz
o'z xizmatlarimizga kafolat beramiz

Xizmatdan foydalanish

DOCTYPE html>

Tekshiruv

Bojxona Tekshiruvi

Address

Buxoro sh, G'ijduvon t, Qumoq MFY, 21-uy

Phone

+998 (90) 081 81 33

Email

abbosjonnizomov555@gmail.com

Bojxona ma'lumotlari

Mahsulot nomi	...
Mahsulot shtrix kodi raqami	...
Bojxona nazoratidan o'tkazilgan sanasi	...

⋘ Orqaga

CSS kodlari (bootstrap).

html{
box-sizing: border-box;
height: 100%;
scroll-behavior: smooth;
}

*,
*::before,
*::after {
box-sizing: inherit;
}

body{
display: flex;
flex-direction: column;
height: 100%;
margin: 0;
font-family: "Arial", sans-serif;
font-weight: 400;
background-color: #fff;
background-image:linear-gradient(rgba(4,9,30,0.7),rgba(4,9,30,0.7)), url(../images/theme.jpg);
background-size: cover;
}

main{
flex-grow: 1;
}

img{
max-width: 100%;
height: auto;
}

.visually-hidden {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
border: 0;
padding: 0;
white-space: nowrap;
clip-path: inset(100%);
clip: rect(0 0 0 0);
overflow: hidden;
}

.container{
width: 100%;
max-width: 1320px;
margin-right: auto;
margin-left: auto;
padding-right: 20px;
padding-left: 20px;
}

ol,
ul{
margin-top: 0;
margin-bottom: 0;
padding-left: 0;
list-style: none;
}

a{
text-decoration: none;
}

.line{
text-decoration: line-through;
}
*{
margin: 0;
padding: 0;
font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}

/* start styles */

.btn{
display: inline-block;
color:white;
font-size: 18px ;
border: 2px solid #fff;
padding: 12px 34px;
cursor: pointer;
}
.btn:hover{
background-color: #a92525;
border: 2px solid #fff;
font-size: 19px;
transition: 1s;
}

li::after{
content: '';
background-color: red;
display: block;
height: 2px;
width: 0%;
margin:auto;
transition: 0.5s;
}
li:hover::after{
width: 100%;
}
*{
font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
margin: 0;
padding: 0;
box-sizing: border-box;
}

html{
box-sizing: border-box;
height: 100%;
scroll-behavior: smooth;
}

*,
*::before,
*::after {
box-sizing: inherit;
}

body{
display: flex;
flex-direction: column;
height: 100%;
margin: 0;
font-family: "Arial", sans-serif;
font-weight: 400;
background-color: #fff;
background-image: url(../images/bg.jpg);
background-size: cover;
}

main{
flex-grow: 1;
}

img{
max-width: 100%;
height: auto;
}

.visually-hidden {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
border: 0;
padding: 0;
white-space: nowrap;
clip-path: inset(100%);
clip: rect(0 0 0 0);
overflow: hidden;
}

.container{
width: 100%;
max-width: 1320px;
margin-right: auto;
margin-left: auto;
padding-right: 20px;
padding-left: 20px;
}

ol,
ul{
margin-top: 0;
margin-bottom: 0;
padding-left: 0;
list-style: none;
}

a{
text-decoration: none;
}

.line{
text-decoration: line-through;
}

/* start styles */

.icon{
width: 60px;
height: 60px;
padding-top: 10px;
background: #fff;
text-align: center;
align-items: center;
border-radius: 50%;
font-size: 22px;
}
.title{
font-weight: 500;
color:#ff0000;
}
Mahsulotlar bazasi.
const products =[
{
id : 12345,
"name": `Baliq mahsulotlari`,
"number": `2654965599`,
"time": `2023-01-01 20:08:00`
},
{
id : 23456,
"name": `Harbiy texnikalar`,
"number": `2654965599`,
"time": `2023-01-01 20:08:00`
},
{
id : 34567,
"name": `Don va don mahsulotlari`,
"number": `2654965599`,
"time": `2023-01-01 20:08:00`
},
{
id : 45678,
"name": `Elektron tovarlar`,
"number": `2654965599`,
"time": `2023-01-01 20:08:00`
},
{
id : 56789,
"name": `Banan`,
"number": `2654965599`,
"time": `2023-01-01 20:08:00`
},
{
id : 67890,
"name": `Kivi`,
"number": `2654965599`,
"time": `2023-01-01 20:08:00`
},
{
id : 78901,
"name": `nimadir`,
"number": `2654965599`,
"time": `2023-01-01 20:08:00`
},
{
id : 89012,
"name": `yana nimadir`,
"number": `2654965599`,
"time": `2023-01-01 20:08:00`
},
{
id : 90123,
"name": `boshqalar`,
"number": `2654965599`,
"time": `2023-01-01 20:08:00`
}
]

Download 3,3 Mb.

1 ... 6 7 8 9 10 11 12 13 14

Download 3,3 Mb.