Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Activity
  • Aug 17 09:32
    User @bjorno43 unbanned @linkin-park
  • Jun 20 21:19
    @bjorno43 banned @shenerd140
  • Apr 25 17:13
    @mstellaluna banned @cmal
  • Jan 08 22:05
    @mstellaluna banned @dertiuss323
  • Nov 07 2018 04:42
    User @texas2010 unbanned @ows-ali
  • Nov 02 2018 16:25
    @texas2010 banned @ows-ali
  • Oct 12 2018 05:50
    @bjorno43 banned @NACH74
  • Oct 05 2018 23:02
    @mstellaluna banned @JomoPipi
  • Sep 16 2018 12:21
    @bjorno43 banned @yash-kedia
  • Sep 16 2018 12:16
    @bjorno43 banned @vnikifirov
  • Sep 05 2018 08:12
    User @bjorno43 unbanned @androuino
  • Sep 05 2018 07:38
    @bjorno43 banned @androuino
  • Aug 23 2018 16:57
    User @bjorno43 unbanned @rahuldkjain
  • Aug 23 2018 16:23
    @bjorno43 banned @rahuldkjain
  • Jul 29 2018 14:13
    User @bjorno43 unbanned @jkyereh
  • Jul 29 2018 01:00
    @bjorno43 banned @jkyereh
  • Jul 10 2018 22:09
    @bjorno43 banned @manafn
  • Jul 06 2018 15:20
    @texas2010 banned @imlegend19
  • Jul 03 2018 12:28
    @bjorno43 banned @vbvmatta
  • Jun 29 2018 13:54
    @bjorno43 banned @OGTechnoBoy
Ivan Ngundela
@ingundela
Screen Shot 2018-08-18 at 20.42.51.png
Hi everyone, Please help me..I’m stuck here with this error:
Screen Shot 2018-08-18 at 20.41.24.png
Screen Shot 2018-08-18 at 20.41.24.png
This is the forkify project
Screen Shot 2018-08-18 at 20.43.56.png
looking around to see what is wrong with my code for hour but don’t find it… may you please help me.. I’m following exactly the same code as the lesson..
Ghost
@ghost~59209a78d73408ce4f6102e8
@ingundela ca n you paste all of the code
Ivan Ngundela
@ingundela
@willybeans Hi...
Screen Shot 2018-08-18 at 20.56.00.png
Thanks
Ghost
@ghost~59209a78d73408ce4f6102e8
can you please not send images
Ivan Ngundela
@ingundela

``
import Search from './models/Search';
import * as searchView from './views/searchView';
import { elements } from './views/base';

const state = {};

const controlSearch = async () => {
// 1) Get query from view
const query = searchView.getInput();
console.log(query);

if (query) {
    // 2) New search object and add to state
    state.search = new Search(query);

    // 3) Prepare UI for results
    searchView.clearInput();
    searchView.clearResults();
    // 4) Search for recipes
    await state.search.getResults();

    // 5) render results on UI
    searchView.renderResults(state.search.result);
}

}

elements.searchForm.addEventListener('submit', e => {
e.preventDefault();
controlSearch();
});
``

Ghost
@ghost~59209a78d73408ce4f6102e8
you were right the first time it needs three
Ivan Ngundela
@ingundela
@willybeans I’m not able to paste this code more clearly
Ghost
@ghost~59209a78d73408ce4f6102e8
import Search from './models/Search';
import * as searchView from './views/searchView';
import { elements } from './views/base';

const state = {};

const controlSearch = async () => {
    // 1) Get query from view
    const query = searchView.getInput(); 
    console.log(query);

    if (query) {
        // 2) New search object and add to state
        state.search = new Search(query);

        // 3) Prepare UI for results
        searchView.clearInput();
        searchView.clearResults();
        // 4) Search for recipes
        await state.search.getResults();

        // 5) render results on UI
        searchView.renderResults(state.search.result);
    }
}

elements.searchForm.addEventListener('submit', e => {
    e.preventDefault();
    controlSearch();
});
and the code for search view?
Ivan Ngundela
@ingundela
import { elements } from './base';

export const getInput = () => elements.searchInput.value;

export const clearInput = () => {
    elements.searchInput.value = '';
};

export const clearResults = () => {
    elements.searchResList.innerHTML = '';
};

const renderRecipe = recipe => {
    const markup = ` 
        <li>
            <a class="results__link" href="#${recipe.recipe_id}">
                <figure class="results__fig">
                    <img src="${recipe.image_url}" alt="${recipe.title}">        
                </figure>
                <div class="results__data">
                     <h4 class="results__name">${recipe.title}</h4>
                     <p class="results__author">${recipe.publisher}</p>
                </div>        
            </a>
         </li>
    `;
    elements.searchResList.insertAdjacentHTML('beforeend', markup);
}

export const renderResults = recipes => {
    recipes.forEach(renderRecipe);
}
Ghost
@ghost~59209a78d73408ce4f6102e8
when you console.log(query) are you getting anything?
if im not mistaken your error is telling you that this is broken: const query = searchView.getInput(); console.log(query);
Can you send the code for base.js as well
Ivan Ngundela
@ingundela
export const elements = {
    searchForm: document.querySelector('.search'),
    searchInput: document.querySelector('.search_field'),
    searchResList: document.querySelector()

};
@willybeans not sure.. this is confusing… as it say error at line
Screen Shot 2018-08-18 at 21.05.44.png
Ghost
@ghost~59209a78d73408ce4f6102e8
Right so
Ivan Ngundela
@ingundela
Search view 11
Ghost
@ghost~59209a78d73408ce4f6102e8
you have to follow the tunnel
Its saying you are sending it an empty value at Object.getInput
so i assume you arent getting the value from the function in search view : export const getInput = () => elements.searchInput.value;
uhhh. let me see the html file
Ivan Ngundela
@ingundela
@willybeans not able to paste the html file (very long file) how to I do it?
Ghost
@ghost~59209a78d73408ce4f6102e8
A few things id suggest you do:
1) console log in search view and check the function getInput is getting the input from class .search-field
2) check your console.log is logging something from query @ const query = searchView.getInput(); console.log(query);
3) check to make sure your class in your html file doesnt have a typo at .search-feild
Ivan Ngundela
@ingundela
@willybeans OK
Ghost
@ghost~59209a78d73408ce4f6102e8
if you want to send the html dont send the entire thing, just send what is inside of the body tag
Ivan Ngundela
@ingundela
<div class="results">
            <ul class="results__list">
                <!--
                <li>
                    <a class="results__link results__link--active" href="#23456">
                        <figure class="results__fig">
                            <img src="img/test-1.jpg" alt="Test">
                        </figure>
                        <div class="results__data">
                            <h4 class="results__name">Pasta with Tomato ...</h4>
                            <p class="results__author">The Pioneer Woman</p>
                        </div>
                    </a>
                </li>
@willybeans I think this is part of the code used in search view
Ghost
@ghost~59209a78d73408ce4f6102e8
nope
do a ctrl + f and search for search
Ivan Ngundela
@ingundela
@willybeans I got it mate….. solved..THANKS
Ghost
@ghost~59209a78d73408ce4f6102e8
@ingundela congrats! happy learning!
Barbara Pentoney
@flyfishingbarbara
@naveencoder13 did you ever get an answer to your quest about why the iframe disappears..?? i dont have an answer, im curious how that got fixed...
hi peeps - anyone have exp with vs code and vue.js...?? i don't know why i cant see my project in web browser....
glitz20
@glitz20

hey guys how can I get state from another component? I have implemented textbox like this one
https://github.com/nossas/slate-editor/blob/develop/packages/slate-editor-example/src/example/pages/Home.js

but the state of the content I type is in diffferent folder/package. So how can access to that state, so that I can post it to the database?

here is the editor package
https://github.com/nossas/slate-editor/blob/develop/packages/slate-editor/src/SlateEditor.js

glitz20
@glitz20
@willybeans I have imported some component and the imported component contains state. I want to edit value in the state
Corey Lewis
@cursiv3
@sabin20 you could just post it to the DB from where it is
Is there a reason you need to move it to another component to post?
glitz20
@glitz20
@cursiv3 I have my <slatecontent /> here like this
but this is build upon other packages so
its state is here