Tamamlanmış

JavaScript table sorting and filtering

I need to include the attached JSON content into a JavaScript file that can be included on a webpage without using any other JavaScript dependencies (example, no jQuery). This also needs to be done entirely in the browser without the need for any server side scripts-- so JavaScript, CSS, and HTML only.

I then need that data to be displayed in a table format with 4 dropdown (select boxes) and 2 checkboxes as filters that will update the displayed content in the table on the page:

Filtering:

1) Dropdown that filters for type

2) Dropdown that filters for score

3) Dropdown that filters for title

4) Dropdown that filters for employer

5) Checkbox that filters for only active = true

6) Checkbox that filters for only gender = female

Based on what the user selects in the dropdowns (without having to push a button, it should start filtering immediately on changes), it will hide/show items in the table. The table however should show all items in the JSON object, not just these 6 filterable items

Sample JSON object:

[

{

"_id": "1234",

"name": "John Smith",

"active": true,

"type": "primary",

"score": "good",

"title": "construction",

"employer": "abc corp",

"age": 28,

"eyeColor": "green",

"gender": "male",

"about": "Consequat consectetur adipisicing labore ea proident do ad. Sint ut culpa reprehenderit eiusmod commodo nostrud incididunt quis. Ea anim proident proident ex quis aliquip id tempor esse tempor. Eu velit fugiat excepteur consectetur aliqua enim sit veniam adipisicing labore sunt fugiat. Laboris minim aliquip adipisicing quis occaecat ex nulla pariatur voluptate laborum cillum."

},

{

"_id": "48484",

"name": "Jane Smith",

"active": true,

"type": "primary",

"score": "great",

"title": "cfo",

"employer": "def corp",

"age": 39,

"eyeColor": "blue",

"gender": "female",

"about": "Eu non aliqua velit reprehenderit proident cupidatat nulla nulla deserunt enim. Officia cupidatat adipisicing ullamco labore et anim do laborum officia in sit laboris incididunt. Ea duis laboris sunt nulla laboris anim magna quis. Velit fugiat id Lorem do minim cillum Lorem pariatur labore. Commodo laboris non dolore labore aute. Elit Lorem nostrud id veniam aute do excepteur fugiat occaecat veniam voluptate. Ad cillum tempor eiusmod id sit tempor do laborum ullamco voluptate laborum occaecat."

},

{

"_id": "44422",

"name": "Josh Smith",

"active": false,

"type": "secondary",

"score": "bad",

"title": "secretary",

"employer": "def corp",

"age": 51,

"eyeColor": "blue",

"gender": "female",

"about": "Et id ea mollit Lorem dolore aliquip duis ea adipisicing consequat ex elit. Ex aute ipsum veniam sunt aliquip mollit. Cillum sit consectetur non laborum. Consectetur et laboris esse adipisicing. Et voluptate ex reprehenderit duis elit magna aliqua ad ad ex non pariatur. Exercitation ipsum laborum eu exercitation aute laboris mollit proident sit ipsum elit mollit."

}

]

Beceriler: Javascript, jQuery / Prototype, CSS, HTML, HTML5

Daha fazlasını gör: list table sorting project, javascript table column drag, javascript table total sum, html javascript table freeze column, javascript table collaps, javascript table select row, javascript table sort php mysql, showhide javascript table, javascript table row add custom attribute, javascript table freeze column, javascript table row page, javascript table row page sample, table sorting javascript sql, javascript visual sorting table

İşveren Hakkında:
( 2 değerlendirme ) Newport Beach, United States

Proje NO: #23483030

Seçilen:

Ahmed818

Hello, ⭐⭐⭐⭐⭐ i am interested in this project , i can write js , jquery code to filter your input json and show the filtered data to html table can begin now waiting your answer on chat Regards ⭐⭐⭐⭐⭐

1 gün içinde %selectedBids___i_sum_sub_4%%project_currencyDetails_sign_sub_5% USD
(40 Değerlendirme)
4.3

Bu iş için 8 freelancer ortalamada $29 teklif veriyor

VileGnosis

I can make this offline json object sorter for you within an hour. My average project completion time is within 3-5 hours on the same day. The skills I have include PHP, HTML5, CSS3, JavaScript, jQuery, WordPress Theme Daha Fazla

1 gün içinde %bids___i_sum_sub_32%%project_currencyDetails_sign_sub_33% USD
(152 Değerlendirme)
6.5
acesolution

Hello Sir , I am highly interested in this project please provide me a chance to work for you. Thanks

$30 USD in 2 gün içinde
(79 Değerlendirme)
6.3
urmate

Hi There I am a senior software engineer with 10 years of practical programming experience. I have excellent programming and development skills in various programming languages and frameworks. I am interested in your Daha Fazla

$50 USD in 2 gün içinde
(52 Değerlendirme)
5.6
Gadziev

Hello, **How are you today?** I 'm an expert of web development in Russia. I have enough experience for web development such as node js, code igniter, laravel, angular, react js and etc. I have just check your descript Daha Fazla

1 gün içinde %bids___i_sum_sub_32%%project_currencyDetails_sign_sub_33% USD
(10 Değerlendirme)
4.8
Aanaaya

Hello Sir I am Zahoor Ahmad, a professional SEO friendly website developer. I have read your project description and understood your requirements properly. I can develop your business website with full perfection. Our Daha Fazla

$20 USD in 2 gün içinde
(5 Değerlendirme)
3.8
bobga2019

Greetings! I have good experience of javascript and please check my profile. I have done similar work in the past, so it won't take much of your time. Do not pay me until you get full satisfaction. I am looking forward Daha Fazla

1 gün içinde %bids___i_sum_sub_32%%project_currencyDetails_sign_sub_33% USD
(2 Değerlendirme)
3.4
OladipoK

I have the skills required to filter the JSON without using Jquery as wanted. It will be done to your taste and in a more simpler way.

1 gün içinde %bids___i_sum_sub_32%%project_currencyDetails_sign_sub_33% USD
(0 Değerlendirme)
0.0